位置:首頁 > 軟件操作教程 > 編程開發(fā) > CSS > 問題詳情

CSS 文本行間距l(xiāng)ine-height

提問人:劉團圓發(fā)布時間:2020-11-18

    line-height屬性設(shè)置行間的距離(行高),不允許使用負值。該屬性會影響行框的布局。在應(yīng)用到一個塊級元素時,它定義了該元素中基線之間的最小距離,而不是最大距離。

    line-height與font-size的計算值之差(在CSS中稱為“行間距”)分為兩半,分別加到一個文本 行內(nèi)容的頂部和底部??梢园@些內(nèi)容的最小框就是行框。

    原始數(shù)字值指定了一個縮放因子,后代元素會繼承這個縮放因子,而不是計算值。

    line-height屬性的值可以是以下幾種:

    ?normal:設(shè)置合理的行間距。

    ?number:設(shè)置數(shù)字,此數(shù)字會與當(dāng)前的字體尺寸相乘以設(shè)置行間距。

    ?length:設(shè)置固定的行間距。

    ?%:基于當(dāng)前字體尺寸的百分比行間距。

    ?Inherit:規(guī)定應(yīng)該從父元素繼承fine-height屬性的值。

    【例題】設(shè)置文本行間距

    代碼如下:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style>

.d1{

line-height: 50px;

}

</style>

</head>

<body>

<div>這是行高為50px的文字</div>

<div>這是默認行高的文字</div>

<div>這是默認行高的文字</div>

<div>這是默認行高的文字</div>

<div>這是行高為50px的文字</div>

<div>這是默認行高的文字</div>

</body>

</html>

image.png

繼續(xù)查找其他問題的答案?

相關(guān)視頻回答
回復(fù)(0)
返回頂部