height

La propietat CSS height especifica l'alçada d'un element. Per defecte, la propietat defineix l'alçada de l'àrea de contingut. Si box-sizing s'estableix a border-box, aquest determina l'alçada de l'àrea de vora.

/* Keyword value */
height: auto;

/* <length> values */
height: 120px;
height: 10em;

/* <percentage> value */
height: 75%;

/* Global values */
height: inherit;
height: initial;
height: unset;

Les propietats min-height i max-height anul·la height.

Sintaxi

Valors

<length>

Defineix l'alçada com un valor absolut.

<percentage>

Defineix l'alçada com un percentatge de l'alçada del bloc contenidor.

border-box 

Si està present, s'aplica abans <length> o <percentage> a la caixa de vora de l'element.

content-box 

Si està present, s'aplica abans <length> o <percentage> a la caixa de contingut de l'element.

auto

El navegador calcularà i seleccionarà una alçada per a l'element especificat .

fill

Utilitzeu la grandària fill-available en línia o la grandària fill-available del bloc, segons correspongui a la modalitat d'escriptura.

max-content 

L'alçada preferida intrínseca.

min-content 

L'alçada mínima intrínseca.

available 

L'alçada del bloc contenidor menys el marge vertical, la vora i el farciment.

fit-content 

El més gran de:

• l'alçada mínima intrínseca.
• la menor de l'alçada intrínseca preferida i l'alçada disponible.

Sintaxi formal

[ <length> | <percentage> ] && [ border-box | content-box ]? | available | min-content | max-content | fit-content | auto

Exemple

HTML

<div id="red">
  <span>I'm 50 pixels tall.</span>
</div>
<div id="green">
  <span>I'm 25 pixels tall.</span>
</div>
<div id="parent">
  <div id="child">
    <span>I'm half the height of my parent.</span>
  </div>
</div>

CSS

div {
  width: 250px;
  margin-bottom: 5px;
  border: 3px solid #999999;
}

#red {
  height: 50px;
}

#green {
  height: 25px;
}

#parent {
  height: 100px;
}

#child {
  height: 50%;
  width: 75%;
}

Especificacions

Navegadors compatibles

Vegeu també

• model de caixa, width, box-sizing, min-height, max-height