CSS max-width Właściwość
Przykład
Ustaw maksymalną szerokość elementu <p> na 150 pikseli:
p.ex1 {
max-width: 150px;
}
Więcej przykładów „Wypróbuj sam” poniżej.
Definicja i użycie
Właściwość max-width
określa maksymalną szerokość elementu.
Jeśli zawartość jest większa niż maksymalna szerokość, automatycznie zmieni wysokość elementu.
Jeśli zawartość jest mniejsza niż maksymalna szerokość,
max-width
właściwość nie działa.
Uwaga: Dzięki temu wartość
właściwości width nie będzie większa niż
max-width
. Wartość
max-width
właściwości zastępuje właściwość width.
Domyślna wartość: | Żaden |
---|---|
Dziedziczny: | nie |
Animowalny: | tak, zobacz poszczególne właściwości . Przeczytaj o animacji |
Wersja: | CSS2 |
Składnia JavaScript: | obiekt .style.maxWidth="600px" |
Obsługa przeglądarki
Liczby w tabeli określają pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.
Property | |||||
---|---|---|---|---|---|
max-width | 1.0 | 7.0 | 1.0 | 2.0.2 | 7.0 |
Składnia CSS
max-width: none|length|initial|inherit;
Wartości nieruchomości
Value | Description | Play it |
---|---|---|
none | No maximum width. This is default | |
length | Defines the maximum width in px, cm, etc. Read about length units | |
% | Defines the maximum width in percent of the containing block | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Więcej przykładów
Przykład
Ustaw maksymalną szerokość elementu <p> na 50% kontenera:
p.ex1 {
max-width: 50%;
}
Powiązane strony
Samouczek CSS: Wysokość i szerokość CSS
Odniesienie CSS: właściwość min-width
Dokumentacja HTML DOM: właściwość maxWidth