html5 语义 - span 标签与 p 标签答案

【问题标题】：html5 semantics - span tag vs p taghtml5 语义 - span 标签与 p 标签
【发布时间】：2015-02-18 06:34:15
【问题描述】：

在以下标记中使用 span 标签在语义上是否正确？

<div itemscope itemtype ="http://schema.org/Movie">
  <h1 itemprop="name">Avatar</h1>
  <span>Director: <span itemprop="director">James Cameron</span> (born August 16, 1954)</span>
  <span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>
</div>

是否应该将导演和类型放在 p 元素中？你应该用 p 标签替换开头的 div 吗？将导演和流派仅仅放在跨度标签内似乎是不正确的。

我正在学习 html，并在 schema.org 文档中遇到了这段代码。如果有人能为我澄清事情，我将不胜感激。谢谢。

【问题讨论】：

When to use <span> instead <p>? 的可能重复项
没有明确的解释
@user3907671 您可以使用这种方式，但<span> 不会在<span> 中放置block 的任何元素。 block 元素不能进入元素 inline。如果我说错了，请纠正我。
@user3907671 你想阅读the most voted answers first。

标签： html

【解决方案1】：

根据http://validator.w3.org/check 的验证器，此代码符合 HTML5：

<!DOCTYPE html>
<html>
<head>
<title>Title</title>
</head>
<body>
<div itemscope itemtype ="http://schema.org/Movie">
  <h1 itemprop="name">Avatar</h1>
  <span>Director: <span itemprop="director">James Cameron</span> (born August 16, 1954)</span>
  <span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>
</div>
</body>
</html>

编辑：谈到语义，span 标签“本身没有任何意义，但与全局属性一起使用时会很有用”（参见specifications）。使用无属性的span 标签是没有意义的，事实上，这里推荐使用p 标签。

【讨论】：

【解决方案2】：

默认情况下，span 在 HTML 中没有真正的语义含义。这只是一种将内联内容与其他内联内容隔开的方法。

div 没有其他任何真正的语义含义。 divs 和 spans 都是通用容器。

如果您想在示例中添加 some 语义含义，我建议您使用无序列表或定义列表。

说了这么多，你有什么不正确的吗？不，不一定——特别是如果内容本身是相当不言自明的。

【讨论】：