知优码

您现在的位置是:首页 > WEB相关 > html文档

html文档

p标签和div标签的区别与用法

知优码 2019-11-16html文档
一、css属性判别1、结构不合div与p均是一对入手下手与闭合标签。div以
起源,以
完毕的一对标签。p以

最早,以

竣事的一对标签。2、名称差异div是构造框架标签;p

一、css属性判别

1、结构不合
div与p均是一对入手下手与闭合标签。
div以<div>起源,以</div>完毕的一对标签。

p以<p>最早,以</p>竣事的一对标签。

2、名称差异
div是构造框架标签;
p是段落标签,机关文章标签。

3、div与p基本css属性
div与p均独占一行的块元素标签,独一辨别,p自带有不一定margin-top和margin-bottom属性值,而div两个属性值为0,也便是两个p之间有未必间距,而div没有。

div高下没有距离间距,而p有。

p自带间隔一行的间距,而div没有上下间隔间距
p自带距离一行的间距,而div不有高低隔断间距

从上实例图望见div与p之间在于隔断。而p隔断是受line-height行高影响,行高小那末p高下间距就小,行高值大,那末高低段落p间隔就大。

二、框架结构

在结构html重构时分,div首要用于布局框架,大小结构结构均使用div来机关。

div用于布局框架
div用于结构框架

一样平常布局均运用div标签机关。

三、内容机关

结构形式,结构文章时刻,文章分段,均采纳p标签。

布局文章采用p比较多
机关文章采纳p相比多

四、一小部分形式组织

当然无心布局只需一段翰墨地方,可接纳div也可采取p标签,假设采用p标签,但不须要p自带凹凸间距,这个时刻我们就需求肯定p自带高低间距,设置CSS:
.abc p{margin-top:0;margin-bottom:0}
如许便可必定class=abc对象内p凹凸间距为0.

取消p标签上下间距
css取缔p标签凹凸间距

CSS5建议:普通结构框架结构应用div布局,文章段落采取p标签组织。这样遵照标签听命应用标签,只管即便做到不滥用标签标准使用html标签元素。