嵌套除li以外的其他HTML标签在ul中。

Question

这些代码片段语法上正确吗？我正在使用第一个代码片段构建导航（将标头标签嵌套在ul内）。如果它是错误的，或者这是一种不好的做法，那么缺点是什么。

<ul class="site-title left">
  <header>
   <li><h1>site title</h1></li>
  </header>                         
</ul>

和

<ul class="site-title left">
  <span>
   <li><h1>site-title</h1></li>
  </span>                           
</ul>

- It worked yesterday.

---

缺点是它在不同的浏览器中可能无法正常工作或呈现不同的外观。 - Joel Harkes

我建议使用：<li class="header"> - Joel Harkes

此外，如果您需要检查语法的有效性，W3C验证器是您的好帮手。 - lime

正如答案所述，这不是正确的语法。我还会认为它在语义上也可能是不正确的。如果这是导航，网站标题就不应该出现在其中。顺便说一下，你想要的最佳解决方案很可能是使用嵌套列表。 - DA.

Answer 1

不

根据规范，ul元素表示一个项列表，在该列表中，项目的顺序不重要-即更改顺序不会实质性地改变文档的含义。

列表的项目是ul元素的li元素子节点。

因此，UL元素的子元素必须是li元素。

更具体地说，在ul标签下，规范如下：

内容模型：

   Zero or more li elements.

但是，这样做是完全合法的：

<ul class="site-title left">
   <li><span><h1>site-title</h1></span></li>
</ul>

- Benjamin Gruenbaum

---

惊人的是你可以在规格说明中找到什么，是吗？我发现这个版本对于这种事情来说稍微容易处理一些：http://dev.w3.org/html5/markup/ul.html - mu is too short

近几年一直在努力使规范更易读懂，最终目标是让开发人员和实现者（如浏览器供应商）能够轻松地获取此类信息 :) 感谢dev.w3.org的链接，它们确实更易读，我只是习惯于阅读每日构建版本 :) 我会更新链接。 - Benjamin Gruenbaum

他们在规格方面做得非常好，最新的规格非常清晰、简洁和易读。 - mu is too short

Answer 2

验证输出：1个错误

错误行25，列51：在此上下文中，元素h1不允许作为元素span的子元素。（抑制此子树中的进一步错误。）

            <li><span><h1 class="Tabellenkopf">Menü</h1></span></li>

- Shorty

---

这不是他所问的！我认为他想知道一个不是li元素能否放置在ul块的第一个子元素位置。答案似乎是否定的。 - asdru