如何在 HTML 中编写符合 W3C 的多级项目符号？答案

【问题标题】：How to write W3C compliant multi-level bullet points in HTML?如何在 HTML 中编写符合 W3C 的多级项目符号？
【发布时间】：2011-05-26 19:39:34
【问题描述】：

是否可以在 HTML 中编写符合 W3C 的多级项目符号（无序列表）？

可以使用嵌套 ul，但不符合 W3C。

 <ul>
     <li>myItem 1</li>
     <li>myItem 2</li>
     <ul>
        <li>myItem 2a</li>
     </ul>
     <li>myItem 3</li>
     <li>myItem 4</li>
 </ul>

我的物品 1
我的物品 2

我的物品 2a

我的物品 3
我的物品 4

在 Visual Studio 中，上面的代码给出警告：Validation (XHTML 1.0 Transitional): Element 'ul' cannot be nested within element 'ul'

【问题讨论】：

验证器在您尝试时抱怨什么？请发布示例 HTML 和准确的验证输出。
您是否尝试过将<ul> 放入<li> 并查看验证器的内容？
你自然应该可以。如果没有，那你就错了。
随着这个线程的枯竭，Ben 并非如此。这是一个类似的线程：stackoverflow.com/questions/2235257/…

标签： html w3c-validation html-lists

【解决方案1】：

补充大卫托马斯的回答，这将删除不需要的项目符号：

<ul>
    <li>myItem 1</li>
    <li>myItem 2        
        <ul>
            <li>myItem 2a</li>
        </ul>
    </li>
    <li>myItem 3</li>
    <li>myItem 4</li>
</ul>

【讨论】：

注意：它需要至少一个 li 父元素 ul
这其实是正确的答案。关键是muItem 2a是缩进的，因为它嵌套在inside myItem 2，所以ul应该嵌套在inside它的li
它对我来说效果很好，而且比 David Thomas 的解决方案更简单。感谢马龙

【解决方案2】：

ul 或 ol 的唯一有效子元素是 li 元素；但是，li 可以包含ul（或ol）。为了实现您的目标：

<ul>
  <li>myItem 1</li>
  <li>myItem 2</li>
  <li style="list-style-type:none">
    <ul>
      <li>myItem 2a</li>
    </ul>
  </li>
  <li>myItem 3</li>
  <li>myItem 4</li>
</ul>

【讨论】：

...如果有人可以将我的代码块编辑为代码，将不胜感激（我不知道是 iPhone 编辑的怪异之处，还是我自己的误用搞砸了它，尽管反复尝试）。
我没有足够的分数来编辑你的答案:-(你的代码创建了一个不需要的项目符号点。我怎样才能摆脱它？谢谢。
WTF？最后一个<ul> 破坏了整个格式，直到我删除了所有空格。以前从未见过。一定是一些邪恶的苹果诡计:)
这是唯一的 valid (x)html 解决方案。额外的项目符号应通过 css 处理。我建议提出一个单独的问题以寻求解决该问题的帮助。
实际上你所要做的就是将嵌套的 UL 放在第二个 li 中，而不是创建一个空白的。这样你就不会得到不需要的子弹