Īpašība max-width

Īpašība max-width nosaka elementa maksimālo platumu. Īpašības vērtības var būt jebkuras mērvienības izmēriem vai atslēgvārds none, kas nozīmē, ka vērtība nav noteikta.

Parasti īpašība tiek iestatīta elementam ar peldošu platumu (platums noteikts procentos vai vispār nav noteikts, un elementa platumu nosaka tā saturs). Ja elementa platums ir noteikts procentos - palielinot pārlūkprogrammas logu, platums palielināsies, līdz tas sasniedz vērtību max-width.

Sintakse

cssselektors {
  max-width: vērtība;
}

Piemērs

Šajā piemērā platums ir procents no vecāka elementa platuma. Palieliniet pārlūkprogrammas loga platumu, un konteiners arī palielināsies, lai pielāgotos pārlūkprogrammas loga platumam. Tomēr tas palielināsies tikai līdz vērtībai, kas noteikta max-width, tas ir 900px. Kad konteiners sasniegs šo platumu - tas pārtrauks palielināties:

html<div id="elem"></div>

css#elem {
  width: 70%;
  max-width: 900px;
  height: 300px;
  border: 1px solid black;
}

Результат:

Piemērs

Šajā piemērā konteinera platums ir ierobežots no abām pusēm: tas nevarēs kļūt lielāks par 900px un mazāks par 400px:

html<div id="elem"></div>

css#elem {
  width: 70%;
  max-width: 900px;
  min-width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

Skatiet arī