Свойство line-height
Задает межстрочный отступ для текста
line-height: 1.5;Пошаговый план! Как быстро научиться создавать сайты!
Chrome
Все
Edge
Все
FireFox
Все
IE
6+
iOS Safari
Все
Opera
Все
Safari
Все
Значения
line-height: normal;
Задает стандартный межстрочный отступ, зависит от браузера
<style>
.example-1 {
font-size: 16px;
line-height: normal;
}
</style>
<p class="example-1">Lorem ipsum dolor sit amet, consectetur
adipisicing elit. Explicabo, deserunt, non, ratione illum
ipsa quis autem Voluptatum!</p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo, deserunt, non, ratione illum ipsa quis autem Voluptatum!
line-height: 1.5;
Задает межстрочный отступ относительно размера текста элемента. Значение 1 = размеру текста. Формула подсчета: line-height * font-size = line-height px, например 1.5*16 = 24px;
<style>
.example-2 {
font-size: 16px;
line-height: 1.5;
}
</style>
<p class="example-2">Lorem ipsum dolor sit amet, consectetur
adipisicing elit. Explicabo, deserunt, non, ratione illum
ipsa quis autem Voluptatum!</p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo, deserunt, non, ratione illum ipsa quis autem Voluptatum!
line-height: 24px;
Задает межстрочный отступ в единицах: px, em, rem, vw, vh, %
<style>
.example-3 {
font-size: 16px;
line-height: 24px;
}
</style>
<p class="example-3">Lorem ipsum dolor sit amet, consectetur
adipisicing elit. Explicabo, deserunt, non, ratione illum
ipsa quis autem Voluptatum!</p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo, deserunt, non, ratione illum ipsa quis autem Voluptatum!