這篇文章主要講解了“CSS中line height繼承問題分析”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“CSS中line height繼承問題分析”吧！
在在css中，line-height屬性用于設置多行元素的空間量，比如文本。對于塊級元素，它指定元素行盒的最小高度。對于非替代的inline元素，它用于計算行盒的高度。
line-height語法
/*Keywordvalue*/
line-height:normal;
/*Unitlessvalues:usethisnumbermultiplied
bytheelement‘sfontsize*/
line-height:3.5;
/*<length>values*/
line-height:3em;
/*<percentage>values*/
line-height:34%;
/*Globalvalues*/
line-height:inherit;
line-height:initial;
line-height:unset;
line-height取值
normal取決于用戶端。桌面瀏覽器（包括Firefox）使用默認值，約為1.2，這取決于元素的font-family。
<數字>該屬性的應用值是這個無單位數字<數字>乘以該元素的字體大小。計算值與指定值相同。大多數情況下，這是設置line-height的推薦方法，不會在繼承時產生不確定的結果。
<長度>指定<長度>用于計算linebox的高度。查看<長度>獲取可能的單位。以em為單位的值可能會產生不確定的結果。
<百分比>與元素自身的字體大小有關。計算值是給定的百分比值乘以元素計算出的字體大小。百分比值可能會帶來不確定的結果。
經過測試，上述的幾種形式中，帶單位的取值會被子元素繼承，只有不帶單位（如1.2）或者normal不會被繼承。
測試代碼：
<!DOCTYPEhtml>
<html>
<head>
<title></title>
<styletype="text/css">
div{
font-size:14px;
}
.p1{
line-height:21px;
}
.p2{
line-height:1.5;
}
.p3{
line-height:150%;
}
.p4{
line-height:1.5em;
}
.p5{
line-height:normal;
}
h2{
width:8em;
overflow-wrap:break-word;
font-size:28px;
}
</style>
</head>
感謝各位的閱讀，以上就是“CSS中line height繼承問題分析”的內容了，經過本文的學習后，相信大家對CSS中line height繼承問題分析這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
