block-size
Установите размер элемента <div> в направлении блока:
div {
block-size: 200px;
}
Попробуйте сами »
Определение block-size
CSS свойство block-size
определяет размер элемента в направлении блока.
Примечание: Соответствующее CSS свойство writing-mode
определяет направление блока, и это влияет на результат CSS свойства block-size
. Для страниц на английском языке направление блока - вниз, а направление встроенной строки - слева направо.
CSS свойства
block-size
и
inline-size
очень похожи на CSS свойства
width
и
height
, но свойства
block-size
и
inline-size
зависят от блочных и встроенных направлений.
Значение по умолчанию: | auto |
---|---|
Унаследовано: | no |
Анимируемый: | yes. Читайте о animatable Попробуй |
Версия: | CSS3 |
JavaScript синтаксис: | object.style.blockSize="100px" Попробуй |
Поддержка block-size
Цифры в таблице указывают первую версию браузера, которая полностью поддерживает это свойство.
Свойство | |||||
---|---|---|---|---|---|
block-size | 57.0 | 79.0 | 41.0 | 12.1 | 44.0 |
Синтаксис block-size
inset-block: auto|value|initial|inherit;
Значения block-size
Значение | Описание | Демонстрация |
---|---|---|
auto | По умолчанию. Значение элемента block-size по умолчанию. | Демо ❯ |
length | Определяет размер блока в px, pt, cm, и т.д. Читайте о единицах измерения длины | Демо ❯ |
% | Задает размер блока в процентах относительно размера родительского элемента на соответствующей оси. | Демо ❯ |
initial | Устанавливает для этого свойства значение по умолчанию. Читайте о initial | |
inherit | Наследует это свойство от своего родительского элемента. Читайте о inherit |
Примеры block-size
С CSS свойством writing-mode
значение свойства элемента <div> установлено на 'vertical-rl', направление блока перемещается с нисходящего на боковое, и это изменяет направление, в котором работает свойство размера блока:
div {
block-size: 250px;
writing-mode: vertical-rl;
}
Попробуйте сами »
Страницы по теме block-size
CSS Учебник: CSS Высота и ширина
CSS Учебник: CSS Бокс модель
CSS Справочник: height свойство
CSS Справочник: width свойство
CSS Справочник: writing-mode свойство