css letter-spacing 用于控制元素或文本块中每个文字之间的间距,中英文都可以控制的。使用这个属性,我们可以增加或减少文本字符之间的间距。

它可以使用负值,这样文字就缩到一起去了,显然一般情况我们不会这样去设置的。

语法

letter-spacing: normal | length | initial | inherit;

属性值

  • normal默认。不设置间距。
  • length定义字符之间的间距长度,单位可以为em、ex、pt、px、百分比等。
  • inherit规定应该从父元素继承 letter-spacing 属性的值。

例子

<!DOCTYPE html>
<html>
<head>
<title>CSS letter-spacing 属性</title>
</head>
<body style = "text-align: center;">
<h2 style = "color: blue;">
yxjc123.com CSS letter-spacing 属性例子
</h2>
<p style= "letter-spacing: normal;">
This paragraph has letter-spacing: normal;
</p>
<p style= "letter-spacing: 7px;">
This paragraph has letter-spacing: 7px;
</p>
<p style= "letter-spacing: 7px;">
中文也有效果吗?是的
</p>
<p style= "letter-spacing: 0.7em;">
This paragraph has letter-spacing: 0.7em;
</p>
<p style= "letter-spacing: -1px;">
This paragraph has letter-spacing: -1px;
</p>
<p style= "letter-spacing: -1px;">
中文的效果如何
</p>
</body>
</html> 

效果如图:

css letter-spacing 控制内容间距