css властивість max-width


CSS властивість max-width встановлює максимально допустиму ширину елемента.

Властивість `max-width

Ця властивість не дає значенню властивості width стати більшим, ніж max-width.

Ширини елемента розраховується в залежності від встановлених значень властивостей width, max-width і min-width.

max-width перевизначає width, але min-width перевизначає max-width.

В якості значень можна використовувати одиниці довжини, проценти, а також ключові слова.

Значення властивостей Ширина
min-width < width < max-width width
width < max-width width
width > max-width max-width
min-width > width > max-width min-width
min-width > width < max-width min-width

Дані з таблиці слід розуміти так, якщо значення ширини (width) більше значення max-width, то ширина елемента приймається рівною значенню max-width.

Нотатка:

Властивість max-width перевизначає властивість width.

Нотатка:

Ключові слова впливають на розрахунок ширини й висоти елементу(й не залежать від значення властивості box-sizing). Це не стосується до значень у одиницях довжини або процентах.

Синтакс

max-width: none|length|initial|inherit;

Властивість max-width може отримувати 4 значення:

none

Скасовує максимальну ширину. Без задання.

length

В якості значення приймаються пікселі (px), відсотки (%) і інші одиниці виміру прийняті в CSS. Від`ємні значення не допускаються.

initial

Встановлює цю властивість в значення без задання

inherit

Успадкує значення властивості від свого батьківського елемента

Значення без задання: none
Наслідує: Ні
Анімується: Так
JavaScript синтаксис: object.style.maxWidth="600px"

Переглядачі

Переглядач
max-width

1.0

8.0

1.0

1.0

3.5

Переглядач
max-width

1.0

1.0

1.0

Приклади


Динамічний приклад

Демонстрація роботи властивості

Як задати максимальну ширину для елементу.

Ми задали максимально допустиму ширину елемента <p>.

p {
    max-width: 100px;
}

Додаткові посилання

Всі Коментарі (0)

Зареєструйся на сайті, аби мати змогу залишати коментарі. Зареєструватися  чи
Немає Коментарів