正确的方法来使HTML嵌套列表？
W3文档有一个嵌套列表示例 ，前面加上了“DEPRECATED EXAMPLE：” – 但是他们从来没有用一个没有废弃的例子来纠正它，也没有解释到底是什么问题。 所以我还想知道，这两种方法中的哪一种是写出HTML列表的更正确的方法？
选项1 :(嵌套<ul>是父<ul>的子<ul> ）
<ul> <li>List item one</li> <li>List item two with subitems:</li> <ul> <li>Subitem 1</li> <li>Subitem 2</li> </ul> <li>Final list item</li> </ul>
或者选项2 :(嵌套的<ul>是它所属的<li>一个子<li> ）
<ul> <li>List item one</li> <li>List item two with subitems: <ul> <li>Subitem 1</li> <li>Subitem 2</li> </ul> </li> <li>Final list item</li> </ul>
选项2是正确的。 嵌套列表应位于嵌套列表的<li>元素内。
编辑：
这里是链接到W3C维基列表（摘自下面的评论）： HTML列表维基 。
这是HTML 5 W3C ul规格的链接： HTML5 ul 。 请注意，ul元素可能包含完全零或多个li元素。 这同样适用于HTML5 ol 。 描述列表（ HTML5 dl ）是相似的，但是允许dt和dd元素。
更多备注：
dl列表 – 定义列表。
奥列表 – 有序列表（数字）。
ul列表 – 无序列表（项目符号）。
选项2
<ul> <li>Choice A</li> <li>Choice B <ul> <li>Sub 1</li> <li>Sub 2</li> </ul> </li> </ul>
嵌套列表 – UL
选项2是正确的：嵌套的<ul>是它所属的<li>的子项。
如果您validation ，选项1出现在HTML 5 – 信用： user3272456错误
正确： <ul>是<li>
制作HTML嵌套列表的正确方法是使用嵌套的<ul>作为它所属的<li>的子元素。 嵌套列表应位于嵌套列表的<li>元素内部。
<ul> <li>Parent/Item <ul> <li>Child/Subitem </li> </ul> </li> </ul>
嵌套列表的 W3C标准
列表项可以包含另一个完整列表 – 这被称为“嵌套”列表。 对于像目录这样的东西是很有用的，比如本文开头的那个：
- 第一章
- 第一节
- 第二节
- 第三节
- 第二章
- 第三章
嵌套列表的关键是记住嵌套列表应该与一个特定列表项目有关。 为了在代码中反映出来，嵌套列表包含在该列表项中。 上面列表的代码看起来像这样：
<ol> <li>Chapter One <ol> <li>Section One</li> <li>Section Two </li> <li>Section Three </li> </ol> </li> <li>Chapter Two</li> <li>Chapter Three </li> </code>
请注意嵌套列表如何在<li>和包含列表项（“第一章”）的文本之后开始; 然后在包含列表项的</li>之前结束。 嵌套列表通常构成网站导航菜单的基础，因为它们是定义网站层次结构的好方法。
理论上来说，你可以根据自己的喜好设置多个列表，尽pipe在实践中可能会让列表太深。 对于非常大的列表，您最好将内容分成多个带有标题的列表，或者甚至将其分成不同的页面。
我更喜欢选项二，因为它清楚地显示列表项作为该嵌套列表的拥有者。 我总是倾向于语义上合理的HTML。
如果你validation，选项1出现在HTML 5中的错误，所以选项2是正确的。
你有没有想过使用标签“dt”而不是“ul”嵌套列表？ 它的inheritance风格和结构允许你有一个标题每节，它会自动列表里面的内容。
<dl> <dt>Coffee</dt> <dd>Black hot drink</dd> <dt>Milk</dt> <dd>White cold drink</dd> </dl>
VS
<ul> <li>Choice A</li> <li>Choice B <ul> <li>Sub 1</li> <li>Sub 2</li> </ul> </li> </ul>
这里没有提到的是，选项1允许你任意深度的列表嵌套。
如果你控制内容/ css，这应该不重要，但如果你正在制作一个富文本编辑器，它就派上用场了。
例如，Gmail，收件箱和evernote都允许创build像这样的列表：
有了选项2，你不能应付（你会有一个额外的列表项），与选项1，你可以。
