<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>使用数值来设置行间距</title>
<style type="text/css">
p.small {
line-height: 0.5
}
p.big {
line-height: 2
}
</style>
</head>
<body>
<p>
这是拥有标准行高的段落。 默认行高大约是 1。 这是拥有标准行高的段落。 这是拥有标准行高的段落。 这是拥有标准行高的段落。 这是拥有标准行高的段落。 这是拥有标准行高的段落。
</p>
<p class="small">
这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。
</p>
<p class="big">
这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。
</p>
</body>
</html>
两种方式:
1:通过p标签,配合padding属性设置进行控制:
<p style="display:blockheight:5pxpadding:0px 10px">任意写一段文字www.jingshuiqi.link</p>2:通过line-height标签进行控制(优选):
<p style="line-height:30px;">任意写一段文字</p>以上以内联样式举例,字体方面使用font-size属性控制字体大小,可以多测试几次。
用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>