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实现,这样可轻松调间距距离,实现段与段之间距离排版美化。
更多CSS相关知识,可访问 CSS教程 !!
以上就是css段落间怎么设置距离?的详细内容,更多请关注易知道|edz.cc其它相关文章!