Características height en CSS

La propiedad height en CSS establece la altura de un elemento. De forma predeterminada, esta propiedad se usa para especificar la altura del área de contenido, pero si la propiedad box-sizing se establece en ella, border-box establece la altura del elemento comenzando desde el borde exterior del marco.

Funciones height css

/* es una palabra reservada */ 
height:  auto ;
/*  longitudes */ 
height:  120px ; 
height:  10em ;
/*  porcentajes */ 
height:  75 %;
/* valores globales */ 
height: inherit;
height: initial;
height: unset;

Beneficios importantes min-height y max-height tienen prioridad sobre la propiedad height.

Ejemplos y aplicaciones en código

En el siguiente ejemplo, intentaremos usar la propiedad height para establecer la altura de varios elementos 

   height: 50px;


  height: 3em;


  

    height: 50%;  (la mitad de la  altura del  elemento  padre ) 
   

div {
  box-sizing: border-box;
  margin-bottom: 1em;
  padding: 0.5em;
  border: 1px solid black;
}
.height-50px {
  height: 50px;
}
.height-3em {
  height: 3em;
}
#parent {
  height: 100px;
}
#child {
  height: 50%;
  width: 50%;
}

height: auto | [  |  ];