css linespacing code example
Example 1: line spacing css
line-height: 20px; /* 4px +12px + 4px */
/* OR */
line-height: 1.7em; /* 1em = 12px in this case. 20/12 == 1.666666 */
Example 2: css line spacing
line-height: 1.5; /* Prefered */
line-height: 1.5em;
line-height: 150%;
line-height: 24px;
Example 3: line-height css
.green {
line-height: 1.1;
border: solid limegreen;
}
.red {
line-height: 1.1em;
border: solid red;
}
h1 {
font-size: 30px;
}
.box {
width: 18em;
display: inline-block;
vertical-align: top;
font-size: 15px;
}
Example 4: line-weight css
/* Valeur avec un mot-clé */
line-height: normal;
/* Type <number> */
/* S'il n'y a pas d'unité, cela
représente un facteur multiplicateur
de la taille de la police appliquée à
l'élément */
line-height: 3.5;
/* Valeur de longueur */
/* Type <length> */
line-height: 3em;
/* Valeurs proportionnelles */
/* Type <percentage> */
line-height: 34%;
/* Valeurs globales */
line-height: inherit;
line-height: initial;
line-height: unset;
Example 5: line-height css
<div class="box green">
<h1>Avoid unexpected results by using unitless line-height.</h1>
length and percentage line-heights have poor inheritance behavior ...
</div>
<div class="box red">
<h1>Avoid unexpected results by using unitless line-height.</h1>
length and percentage line-heights have poor inheritance behavior ...
</div>