900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > css如何设置段落间距?margin 属性设置段落间距(code)

css如何设置段落间距?margin 属性设置段落间距(code)

时间:2024-07-29 20:01:03

相关推荐

css如何设置段落间距?margin 属性设置段落间距(code)

web前端|css教程

段落间距,外间距,margin,css

web前端-css教程

段落间距是网页设计里一个提升文章阅读体验的重要因素。但网页排版不想Word那样简单,而作为网页设计师,为了读者的良好阅读体验,我们必须为文章的每个小标题和段落都预留一定的空间,用css有效率地设置段落间距。本章就给大家介绍css margin 属性是怎样设置段落间距。有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。

方维o2o源码演示站,vscode爬虫怎么安,ubuntu免费妈,tomcat优化总结,sqlite数据库版本控制,女人做梦梦见黑色爬虫爬到身上,一键分享 php,本溪360seo推广,中文单页面网站模板免费下载,微信html5模板网站lzw

那么怎样使用css margin 属性设置文字的段落间距?

文本程序源码,ubuntu yolo3,爬虫数据提取神器,配置php收费,seo新闻专题lzw

css margin可以实现上下段落之间间距距离样式的设置,我们知道margin是设置上下左右对象与对象之间距离设置,这里段落也可以使用此css样式实现间距。

eclipse 源码插件,ubuntu怎么连热点,tomcat源码包是哪个,干鱼缸爬虫,php防止爬虫提交,seo外包就上乐云seolzw

下面我们通过简单的代码示例,为大家详细解说关于css margin 属性设置和调整文字段落间距的方法!

margin设置段落间距.cx{margin: 20px 0;}/* css注释: 设置margin为对象上下间距10px */

第一段,没有设置间距。我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!

第二段,没有设置间距。我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!

第三段,设置了间距。我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!

效果图:

其实,margin 属性 是一个简写属性,可以设置元素的所有外边距,使用margin 属性可以同时设置段落的上下间距。我们也可以一个一个设置外边距,设置一个段落的上间距或下间距,方法如下:

margin-top:设置元素的上外边距。

margin-bottom:设置元素的下外边距。

下面我们通过简单的代码示例,为大家详细解说实现方法!

margin设置段落间距*{margin: 0px;padding: 0px;}.a1{margin-top: 20px;}.a2{margin-bottom: 20px;}

第一段,没有设置间距。我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!

第二段,单独设置上间距。我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!

第三段,没有设置间距。我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!

第四段,单独设置下间距。我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!

第五段,没有设置间距。我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!我是一段测试代码!

效果图:

总结:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。