Розмір
Оновлено: 20.01.2023
Розмір
Властивості, що встановлюють розміри елементів, а також обмеження для них.
-
block-size
block-size
Визначає розмір елемента за блоковою віссю, напрямок якої залежить від значення властивості writing-mode. Для горизонтального письма (writing-mode: horizontal-tb) блокова вісь буде вертикальною і block-size встановлює висоту елемента. Для вертикального напрямку письма (writing-mode: vertical-lr і writing-mode: vertical-rl) блокова вісь буде горизонтальною і block-size встановлює ширину елемента.
-
height
height
Встановлює висоту вмісту елемента. За замовчуванням висота визначається автоматично, виходячи з вмісту елемента, але якщо задати фіксоване значення висоти, то вона буде встановлена, незважаючи на обсяг вмісту. Якщо вміст елемента перевищує вказане значення висоти, то висота елемента залишиться незмінною, а вміст відображатиметься поверх нього. Через цю особливість може вийти накладення вмісту елементів один на одного, коли елементи в коді HTML ідуть послідовно. Щоб цього не сталося, додайте властивість overflow зі значенням auto до стилю елемента.
-
inline-size
inline-size
Визначає розмір елемента за рядковою віссю, напрямок якої залежить від значення властивості writing-mode. Для горизонтального листа (writing-mode: horizontal-tb) рядкова вісь буде горизонтальною, inline-size встановлює ширину елемента. Для вертикального напрямку письма (writing-mode: vertical-lr та writing-mode: vertical-rl) рядкова вісь буде вертикальною, inline-size встановлює висоту елемента.
-
max-height
max-height
Встановлює максимальну висоту елемента. Значення висоти елемента обчислюватиметься залежно від значень встановлених властивостей height, max-height і min-height. У табл. 1 показано, чим керується браузер під час спільного використання зазначених стильових властивостей.
-
max-width
max-width
Встановлює максимальну ширину елемента. Значення ширини елемента обчислюватиметься залежно від значень установлених властивостей width, max-width і min-width. У табл. 1 показано, чим керується браузер під час спільного використання зазначених стильових властивостей.
-
min-block-size
min-block-size
Визначає мінімальний розмір елемента по блоковій осі, напрямок якої залежить від значення властивості writing-mode. Для горизонтального письма (writing-mode: horizontal-tb) блокова вісь буде вертикальною і min-block-size встановлює мінімальну висоту елемента. Для вертикального напрямку письма (writing-mode: vertical-lr і writing-mode: vertical-rl) блокова вісь буде горизонтальною і min-block-size встановлює мінімальну ширину елемента.
-
min-height
min-height
Задає мінімальну висоту елемента. Значення висоти елемента обчислюватиметься залежно від установлених значень властивостей height, max-height і min-height. У табл. 1 показано, чим керується браузер під час спільного використання зазначених стильових властивостей.
-
min-width
min-width
Встановлює мінімальну ширину елемента. Якщо вікно браузера за шириною стає меншим за задану мінімальну ширину елемента, то ширина елемента залишається незмінною, а у вікні з'являється горизонтальна смуга прокрутки.
-
width
width
Встановлює ширину вмісту елемента. За замовчуванням ширина залежить від типу елемента: блокові займають усю доступну ширину; ширина рядково-блокових дорівнює ширині їхнього вмісту. Властивість width дає змогу явно задати бажану ширину елемента, незважаючи на його вихідну поведінку.