首頁技術(shù)文章正文

CSS中怎樣修改文字間距？【letter-spacing 屬性】

更新時間:2022-12-01 來源:黑馬程序員 瀏覽量:

IT培訓(xùn)班

letter-spacing 屬性用于定義字間距，所謂字間距就是字符與字符之間的空白距離。letter-spacing 屬性的屬性值可以為不同單位的數(shù)值。在定義字間距時，letter-spacing屬性的取值可以為負，其默認屬性值為normal。

接下來通過一個案例來演示字間距屬性letter-spacing的顯示效果，如例1所示。

例1 example07.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>字間距屬性letter-spacing</title>
<style type="text/css">
h2{letter-spacing:20px;}
h3{letter-spacing:-0.5em;}
</style>
</head>
<body>
<h2>letter spacing（字間距為正值）</h2>
<h3>letter spacing（字間距為負值）</h3>
</body>
</html>
在例1中，第7、8行代碼將h2的字間距設(shè)置為20px，將h3的字間距設(shè)置為-0.5em。運行例1，效果如下圖所示。
1669882863494_4.png
從圖1容易看出，設(shè)置為負值的三級標題文本出現(xiàn)了重疊的效果。




分享到：
在線咨詢 我要報名
和我們在線交談！