如何用CSS设置网页中文字上下行之间的间距？

html-css022

如何用CSS设置网页中文字上下行之间的间距？,第1张

用CSS设置网页中文字上下行之间的间距，首先我们需要理解的是一个行高和高的概念，可以通过这个p或者是其他的标签添加一个height和line-height，然后设置相应的数值，就能够实现上下行的间距设置，具体看下代码：

<html>

<head>

<style>

#div{

width:400px

height:300px

}

#div p{

line-height:30px

}

</style>

</head>

<body>

<div id='div1'>

<p>我是测试文字</p>

</div>

</body>

</html>

1.在文件夹中创建一个“test”的html文件。如图所示

2.在里面添加html标签框架。如图所示

3.在里面添加一个“div”并放入文字。如图所示

4.然后我们发现默认文字之间比较紧凑。如图所示

5.现在我们给div设置一个id为“wd”。如图所示

6.通过css在style使用letter-spacing给wd中的文字设置字间距为30px。#wd{letter-spacing:30px}如图所示

7.在浏览器中打开我们发现字间距变大了。如图所示