Īpašība min-height

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

Parasti tiek iestatīts elementam ar peldošu platumu (augstums noteikts procentos vai vispār nav noteikts, un elementa augstums tiek noteikts pēc tā satura).

Ja minimālais augstums ir noteikts, elements nevar kļūt zemāks par šo augstumu. Ja teksta ir mazāk nekā nepieciešams min-height, elements saglabās min-height augstumu.

Ja teksta ir vairāk, elementa augstums tiks aprēķināts atkarībā no teksta daudzuma.

Sintakse

cssselektors {
  min-height: vērtība;
}

Piemērs

Šajā piemērā augstums nav noteikts vispār un to pārlūkprogramma aprēķinās patstāvīgi, atkarībā no teksta daudzuma. Tomēr, tā kā ir iestatīta īpašība min-height, augstums nemazināsies zem šīs vērtības, pat ja tajā nebūs teksta:

html<div id="elem">
  Lorem ipsum dolor sit amet.
</div>

css#elem {
  min-height: 100px;
  width: 300px;
  border: 1px solid black;
}

Результат:

Piemērs

Pievienosim elementam vairāk teksta - lai notiktu pārplūde pēc augstuma. Šajā gadījumā mūsu bloks vienkārši palielinās pēc augstuma:

html<div id="elem">
  some long text
</div>

css#elem {
  min-height: 100px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

Piemērs

Salīdzinājumam paskatīsimies, kas notiks ar bloku, ja noņemsim minimālo augstumu un tā vietā iestatīsim īpašību height:

html<div id="elem">
  some long text
</div>

css#elem {
  height: 100px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
  margin-bottom: 50px;
}

Результат:

Skatiet arī