image
Use this block for creating an independent image.
Overview
Custom fields of the block
Field |
Type |
Description |
title |
String |
Tooltip content. |
alt |
String |
The alternate text of the image. |
url |
String |
Image address. |
width |
Number |
The width of the image in pixels. |
height |
Number |
The height of the image in pixels. |
content |
BEMJSON |
Image content in SVG format. |
Block description
The block is used to create an independent image that is adapted for specific output modes (screen reader, print, programs for people with limited physical capacities).
Custom fields of the block
title
field
Type: String
.
Specifies the tooltip content.
Open in a new window<img class="image" src="https://img-fotki.yandex.ru/get/16159/259818507.0/0_130be6_4116d8e7_S" title="Find detailed description on bem.info">
HTML{
block: 'image',
url: 'https://img-fotki.yandex.ru/get/16159/259818507.0/0_130be6_4116d8e7_S',
title: 'Find detailed description on bem.info'
}
BEMJSONdeps
alt
field
Type: String
.
Specifies the alternate text of the image. The text provides useful information about the image if a browser cannot display it for some reasons.
Open in a new window<img class="image" src="https://img-fotki.yandex.ru/get/6737/259818507.0/0_130be4_7315e1e0_S" alt="BEM">
HTML{
block: 'image',
url: 'https://img-fotki.yandex.ru/get/6737/259818507.0/0_130be4_7315e1e0_S',
alt: 'BEM'
}
BEMJSONdeps
url
field
Type: String
.
Specifies the address for the image uploading.
Open in a new window<img class="image" src="https://img-fotki.yandex.ru/get/5405/259818507.0/0_130be5_948d59aa_S">
HTML{
block: 'image',
url: 'https://img-fotki.yandex.ru/get/5405/259818507.0/0_130be5_948d59aa_S'
}
BEMJSONdeps
width
field
Type: Number
.
Specifies the image width in pixels.
Open in a new window<img class="image" src="https://img-fotki.yandex.ru/get/17848/259818507.0/0_12ab32_a798a820_X5L" width="200" height="100">
HTML{
block: 'image',
url: 'https://img-fotki.yandex.ru/get/17848/259818507.0/0_12ab32_a798a820_X5L',
width: 200,
height: 100
}
BEMJSONdeps
height
field
Type: Number
.
Specifies the image height in pixels.
Open in a new window<img class="image" src="https://img-fotki.yandex.ru/get/17848/259818507.0/0_12ab32_a798a820_X5L" width="100" height="200">
HTML{
block: 'image',
url: 'https://img-fotki.yandex.ru/get/17848/259818507.0/0_12ab32_a798a820_X5L',
width: 100,
height: 200
}
BEMJSONdeps
content
field
Type: BEMJSON
.
Specifies content of the image in SVG format.
Open in a new window<span class="image" role="img"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="16"><path d="M13.5.5l-8 12L1.7 8l-1 1.6L5.6 15l9.1-13.4z"/></svg></span>
HTML{
block: 'image',
content: '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="16"><path d="M13.5.5l-8 12L1.7 8l-1 1.6L5.6 15l9.1-13.4z"/></svg>'
}
BEMJSONdeps