altura de línea es la altura de cada línea de texto (altura de línea). Si el artículo está ajustado, la altura de todo el cuadro aumentará (número de líneas * altura de línea)
La altura es un valor fijo, que es la altura de la caja. Envolver el artículo no cambiará la altura de la caja.
punto importante:
Si la altura y la altura de la línea de un elemento son iguales, significa que la línea de texto está centrada verticalmente en el elemento (solo texto y solo una línea).
Cuando altura de línea = altura, el elemento estará centrado verticalmente.
Cuando la altura de la línea <altura, el elemento estará hacia arriba.
Cuando altura de línea> altura, el elemento será más bajo.
Al verificar: altura, el ajuste de línea no cambiará la altura del cuadro
<body>
<style>
.box{
width: 100px;
background-color: #ccc;
height: 50px;
}
</style>
<div class="box">ffffffffffsfafaafasdcvrgsvg<br>efgsbdtdrdvrsvdsrdsts<br>ggggggggggg</div>
</body>
Cuando se utiliza la altura de línea, el ajuste de línea cambiará la altura del cuadro:
<body>
<style>
.box{
width: 100px;
background-color: #ccc;
line-height: 50px;
}
</style>
<div class="box">ffffffffffsfafaafasdcvrgsvg<br>efgsbdtdrdvrsvdsrdsts<br>ggggggggggg</div>
</body>
Análisis: después de aumentar, la altura del cuadro se convierte en número de filas 3 * altura de fila 50 = 150;