這篇文章主要介紹“CSS設置行間距和字間距的方法”，在日常操作中，相信很多人在CSS設置行間距和字間距的方法問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”CSS設置行間距和字間距的方法”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！
在css中，可以通過letter-spacing屬性來設置字間距，語法“letter-spacing:值”；通過line-height屬性來設置行間距，語法“line-height:相對數值|絕對數值”。
本教程操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。
CSS設置行間距
在CSS中通過line-height屬性來實現行間距的設置，line-height的值表示的是兩行文字之間基線的距離。
文字的基線，指的是如果給文字加上下劃線，那么上下劃線就是文字的基線。
Line-height的值設置為具體的數值，可以是相對數值，也可以設置為絕對數值，在靜態頁面中，文字大小固定時常常使用絕對數值，而對于論壇和博客這些用戶可以自定義字體大小的頁面，通常設置為相對數值，從而，可以隨著用戶自定義的字體大小改變相應的行間距。
<span style="font-size:24px;"><html>
<head>
<title>
行間距
</title>
<style>
<!--
p.one{
font-size:10pt;
line-height:8pt;
}
p.second{
font-size:18px;
}
p.third{font-size:10px;
}
p.second,p.third{
line-height:1.5em;
}
-->
</style>
</head>
<body>
<p class="one">9月23日是“秋分”，我國古籍《春秋繁露、陰陽出入上下篇》中說：“秋分者，陰陽相半也，故晝夜均而寒暑平?！薄扒锓帧钡囊馑加卸阂皇翘栐谶@時到達黃徑180.一天24小時晝夜均分，各12小時；二是按我國古代以立春、立夏、立秋、立冬為四季開始的季節劃分法，秋分日居秋季90天之中，平分了秋季。</p>
<p class="second">秋分時節，我國常見流域及其以北的廣大地區，均夏侯進入了秋季，日平均氣溫都降到了22℃以下。北方冷氣團開始具有一定的勢力，大部分地區雨季剛剛結束，涼風習習，碧空萬里，風和日麗，秋高氣爽，丹桂飄香，蟹肥橘黃，秋分是美好宜人的時節。</p>
<p class="third">秋季降溫快的特點，使得秋收、秋耕、秋種的“三秋”大忙顯得格外緊張。秋分棉花吐絮，煙葉也由綠變黃，正是收獲的大好時機。華北地區已開始播種冬麥，長江流域及南部廣大地區正忙著晚稻的收割，搶晴耕翻土地，準備油菜播種。</p>
</body>
</html>
</span>代碼如上，第一段文字采用了絕對數值，并且行間距設置的比文字大小還要小，因此，文字發生了部分重疊的現象。
第二段和第三段，分別設置了不同的文字大小，但是由于使用了相對數值，因此，能夠自動的調節行間距。
CSS設置字間距
CSS中通過letter-spacing屬性來調整字間距，這個屬性同樣可以設置相對數值和絕對數值。
<span style="font-size:24px;"><html>
<head>
<title>
字間距
</title>
<style>
<!--
p.one{
font-size:10pt;
letter-spacing:-2pt;
}
p.second{
font-size:18px;
}
p.third{
font-size:11px;
}
p.second,p.third{
letter-spacing:.5em;
}
-->
</style>
</head>
<body>
<p classs="one">文字間距1，負數</p>
<p class="second">文字間距2，相對數值</p>
<p class="third">文字間距3，相對數值</p>
</body>
</html>
</span>代碼如上，可以看到文字間距屬性letter-spacing除了可以使用相對數值和絕對數值外，還可以使用負數來實現文字重疊的效果。
到此，關于“CSS設置行間距和字間距的方法”的學習就結束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續學習更多相關知識，請繼續關注億速云網站，小編會繼續努力為大家帶來更多實用的文章！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
