点击刷新
1、使用line-height属性设置
line-height 属性设置行间的距离（行高）。不允许使用负值。
line-height属性会影响行框的布局。在应用到一个块级元素时，它定义了该元素中基线之间的最小距离而不是最大距离。
line-height 与 font-size 的计算值之差（在 CSS 中成为“行间距”）分为两半，分别加到一个文本行内容的顶部和底部。可以包含这些内容的最小框就是行框。
示例：
<DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
.p1{
line-height: 50px;
}
</style>
</head>
<body>
<p>测试文本！</p>
<p>测试文本！</p>
<p class="p1">测试文本！</p>
<p>测试文本！</p>
</body>
</html>2、使用css padding内边距
padding属性可以设置元素所有内边距的宽度，或者设置各边上内边距的宽度。
行内非替换元素上设置的内边距不会影响行高计算；因此，如果一个元素既有内边距又有背景，从视觉上看可能会延伸到其他行，有可能还会与其他内容重叠。元素的背景会延伸穿过内边距。不允许指定负边距值。
.p1{
padding:10px 0;
}3、css margin外边距
margin属性设置一个元素所有外边距的宽度，或者设置各边上外边距的宽度。
块级元素的垂直相邻外边距会合并，而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合并。同样地，浮动元素的外边距也不会合并。允许指定负的外边距值，不过使用时要小心。
.p1{
margin:10px 0;
}总结：
文章分段，一般使用html p标签，而对分段间距设置我们推荐使用padding和margin实现，这样可轻松调间距距离，实现段与段之间距离排版美化。
© 著作权归作者所有
举报
发表评论
0/200
