css文本间距_教程

1、使用数值来设置行间距

<!DOCTYPE html>

<html>

<head>

<title>使用数值来设置行间距</title>

p.small {

line-height: 0.5

}

p.big {

line-height: 2

}

</style>

</head>

<body>

<p>

这是拥有标准行高的段落。默认行高大约是 1。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。

</p>

这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。

</p>

这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。

</p>

</body>

</html>

先看下我们的html代码，很简单，就是一个div里有一段文字，我们为这个div添加了一个样式 zn

默认情况下，不加任何样式时，这段文字的间距是很小的，如图

为了添加文字的间距，我们可以添加letter-spacing的样式，添加一个zn的样式名，样式代码为 letter-spacing: 12px就是每个文字间会有12像素的间距。

再运行页面，就可以看到效果了。文字间的间距明显加大了。

欢迎分享，转载请注明来源：内存溢出

css文本间距