首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 ><p>、<div>和<span>在超文本标记语言中有什么区别?

<p>、<div>和<span>在超文本标记语言中有什么区别?
EN

Stack Overflow用户
提问于 2013-05-08 15:09:56
回答 6查看 62.7K关注 0票数 42

<p><div><span>之间的区别是什么

它们可以互换使用吗?

因为我面临的问题是,对于<span>的边际不起作用,但是对于<div><p>,它是起作用的。

EN

回答 6

Stack Overflow用户

回答已采纳

发布于 2013-05-08 15:11:47

pdiv元素是块级元素,而span是内联元素,因此跨度上的边距不起作用。或者,您可以使用CSS display: block;使您的span成为块级元素,或者对于span,我更喜欢display: inline-block;

除此之外,这些元素有特定的语义含义,div更适合于具有不同嵌套元素的内容块,p用于段落,而span只是一个空元素,因此请记住,您需要为正确的事情使用正确的标记,因此,例如,将文本包装在div元素中比将其包装在p中的语义要低

票数 60
EN

Stack Overflow用户

发布于 2013-05-08 15:11:56

<p>应该包含文本的副行,<div>使用分区对页面进行布局,而<span>允许标记的样式稍有不同,例如在<p>

这就是它们应该如何在语义上使用,它们的样式由您决定是否使用CSS

票数 22
EN

Stack Overflow用户

发布于 2015-05-20 04:12:38

作为一名web开发人员,我不禁觉得所有这些指导方针在2015年都具有令人难以置信的误导性。

当然,"p“标签是为段落使用而设计的……但是在我100%的应用程序、设计和日常开发中,除了"p“标签施加的限制之外,我们什么都没有遇到……在今天的互联网上,它没有提供任何好处。

我会说是的,"p“是一个描述性的元素,因此,如果这就是它所做的一切;”描述一些东西“,我会全力支持它的……但它不仅仅是描述内容,它直接改变了内容,虽然这本身就是一个限制,但并不是它所做的一切,它还限制了内容。当涉及到web开发时,为什么任何一个头脑正常的人都会有目的地接受一个有限的构建块,这超出了我的理解。从设计的角度来看,这是没有意义的。从结构的角度来看,这是没有意义的。从任何形式的DOM操作阶段来看,这都是没有意义的。

我们一起停止使用"p“标签,除非我们是绝对被迫的(客户端word-press post实现,诸如此类的愚蠢的事情)。我们没有理由不能用好命名的类和ID来描述几乎所有的东西,所以我们看不到任何理由不得不屈从于没有任何好处的“标准”,实际上阻碍了拼图的每一块。"p“标签对开发人员、最终用户和现代搜索引擎都没有帮助。简而言之..。"p“标签在远程复杂的实现中几乎是不受欢迎的(而且有很好的理由),不要让这些标准的纳粹的评论控制你如何显示你的内容!

即使是在这个网站上,一个面向核心开发人员的网站,在它自己的页面顶部也有一个小的弹出框,它可以使用"p“标签,因为它包含了足够的文本到第二行,但由于几乎无数的原因,它被完全捕获在一个div中(只有一个->,而不是DIV div p)……最重要的是,今天,与从DIVs创建的任何描述良好的块相比,"p“很糟糕,这是描述得很好(更多...我说)作为段落"p“,带有非常描述性的id="blurb”。

从Stackoverflow:

代码语言:javascript
复制
<div id="blurb">Stack Overflow is a question and answer site for professional and enthusiast programmers. It&#39;s 100% free, no registration required.</div>

我要说的是

代码语言:javascript
复制
<p>I suck</p>

万岁

代码语言:javascript
复制
<div class="p">I rock</div>

是的,我确实很欣赏我们目前的web标准,像这样的东西仍然有它们的位置,甚至提供了用一些现代浏览器做一些你不能用容器完成的事情的能力,但这只是一个特别的,被破坏的元素"p",作为重构和现代化的HTML的一部分……应该留在属于它的坟墓里。这是一代网页,段落甚至不再是永远的段落……从字面上看,积木会发生变化。这是完全过时和不切实际的。

票数 15
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/16434706

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档