<div>和<span>有语义上的区别吗？</span>

Question

可能是重复问题：
HTML标签DIV和SPAN之间有什么区别？

我知道在编写HTML时，应该考虑语义，例如h1需要作为主标题，h2需要作为子标题，表格需要使用表格标签，使用<em>强调而不是<i>等。除了一个是块级元素，另一个是内联元素，div和span之间是否存在适当的区别？

当我学习时，有人告诉我<span>是用于在行中设置文本样式的。如果我有一小段文本需要放置在网页上的某个特定位置，但它不足以使用<p>标签，我应该使用还是坚持使用

？如果该文本需要跨两行（即需要宽度），并且只包含文本，我应该使用什么？

- DavidR

---

据我所知，div是“分割”，用于分离表示内容。也许有人可以给你一个更详细的答案。 - edl

这是对此问题的重新发布：https://dev59.com/XXVC5IYBdhLWcg3wykaj - KushalP

我认为你所问的是：为什么要使用<span>，而不是使用带有“inline”样式的<div>？ - Joe Phillips

我想问的是，仅仅因为我可以通过设置span标签的边距或position:relative属性来调整文本的位置，这是否是span标签的不正确使用？ - DavidR

@KushalP 这不是转帖 -- 这个问题询问语义差异，而你链接的问题则要求提供简单示例（并且标题有误导性）。 - Armen Michaeli

Answer 1

语义上，无论是 <div> 还是 <span> 都没有固有的含义。它们是“万能”标签，用于处理没有已存在标签适用的内容。如果你在意语义，应该将 div 和 span 当作最后的选择。

它们唯一的区别在于 div 是块级元素，而 span 是行内元素。也就是说，默认情况下 div 会开始一个全新的块，并且技术上只有行内元素和某些 CSS 可以放在 span 中。大多数浏览器似乎会忽略规则（假设为“标签混合”），并且你可以使用 CSS 将任一标签变为另一个，但如果你在意验证或跨浏览器兼容性（你当然在意，对吧？），不要这样做。

- cHao

Answer 2

和

的主要区别在于是行内元素，而

是块级元素，类似于p或段落元素。因此，实质上：

span { display: block; }

实际上是将所有的span转换为div。你可以使用span仅对一行文本进行格式化，如应用效果或填充等。而div通常用于划分网页内容区域，因此如果需要定位文本，则建议使用div。

- Will

---

你正在描述它是如何工作的，而不是它的含义。 - Brendan Long

除了一个是块级元素，另一个是行内元素，div和span之间是否有适当的区别？我假设他已经知道块级元素和行内元素的含义，他所有的问题都是关于如何使用某些东西的。 - Will

Answer 3

是一个分区块，用于跨越行内文本。

所以，

是具有高度和宽度的盒子/块，而是行内元素。

如果您想阅读规范，请点击此链接。

和元素与id和class属性结合使用，提供了一种通用机制来向文档中添加结构。这些元素定义内容为行内（SPAN）或块级（DIV），但对内容不施加其他表现形式。因此，作者可以将这些元素与样式表、lang属性等结合使用，以满足自己的需求和口味。

- Ólafur Waage

Answer 4

"

<span>和<div>都是非常通用的元素。本身它们没有任何意义。

主要区别在于<span>是内联元素。这意味着如果你有像下面这样的东西：

"

<span>Some text.</span> Some other text

你的文本中，“一些其他文本”没有在新行上。如果用 <div>（块元素）替换 span，就会有新行。请注意，在内联元素中放置块元素不是正确的语法。因此，你可以在 <div> 中放置 <span>，但反过来不行。

更多信息请参见： Wikipedia - Span and div About.com - Span vs. div

- phsource

---

块级元素并不总是有新行。 - Joe Phillips

Answer 5

有一个根本的区别：<div>是一个块级元素，而<span>是一个内联元素。这个区别在于，块级元素以换行符开始和结束，而内联元素则不会。

更重要的是，取决于HTML版本，对于块级和内联元素，其他有效元素的规则也不同。

- Michael Borgwardt

Answer 6

简单来说，DIV是一个分割符号！它的目的是在需要将某些元素作为一组处理时使用它！

例如： 使用div来创建一个登录面板，比如隐藏在屏幕左侧，当鼠标悬停在div上时显示出来 :)

- Zuul

Answer 7

你懂了。Span = 行内元素，Div = 块级元素。就是这样。

如果一段文本需要自己的布局（你想把它放在屏幕上的某个地方），那么它就是一个 div。

如果一段文本参与旁边其他文本的布局，那么它就是一个 span。

行内元素不能有自己的布局 -- 否则它就不是行内元素了。

- Matt Brunell