正确的方法来制作HTML嵌套列表？ [英] Proper way to make HTML nested list?

问题描述

W3文档有嵌套列表示例前缀为 DEPRECATED EXAMPLE：，但他们从来没有用一个没有废弃的例子来纠正它，也没有解释到底是什么问题。

那么以下哪种方法是编写HTML列表的正确方法？

选项1 ：嵌套的< ul> 是父$ < ul>

 < UL> 
< li>列出第一项< / li> 
< li>列出包含子项目的项目二：< / li> 
< ul> 
< li>子项目1< / li> 
< li>子项目2< / li> 
< / ul> 
< li>最终清单项目< / li> 
< / ul> 
  

选项2 ：嵌套< ul> ; 是它所属的< li> 的子

 < UL> 
< li>列出第一项< / li> 
< li>列出包含子项目的项目二：
< ul> 
< li>子项目1< / li> 
< li>子项目2< / li> 
< / ul> 
< / li> 
< li>最终清单项目< / li> 
< / ul> 
  

解决方案

选项2 是正确的。

嵌套列表应该位于 $ < li> 元素链接到W3C Wiki列表（摘自下面的评论）： / wiki / HTML_listsrel =noreferrer> HTML列表Wiki 。

链接到HTML5 W3C ul spec： HTML5 ul 。请注意， ul 元素可能包含零个或多个 li 元素。这同样适用于 HTML5 ol 。
说明列表（ HTML5 dl ）类似，但同时允许 dt 和 dd 元素。

更多注意事项：

• dl =定义列表。


• ol =有序列表（数字）。
• ul =无序列表（项目符号）。

The W3 docs have a nested list example prefixed by DEPRECATED EXAMPLE:, but they never corrected it with a non-deprecated example, nor explained exactly what is wrong with the example.

So which of these ways is the correct way to write an HTML list?

Option 1: the nested <ul> is a child of the parent <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>

Option 2: the nested <ul> is a child of the <li> it belongs in

<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>

解决方案

Option 2 is correct.

The nested list should be inside a <li> element of the list in which it is nested.

Link to the W3C Wiki on Lists (taken from comment below): HTML Lists Wiki.

Link to the HTML5 W3C ul spec: HTML5 ul. Note that a ul element may contain exactly zero or more li elements. The same applies to HTML5 ol. The description list (HTML5 dl) is similar, but allows both dt and dd elements.

More Notes:

• dl = definition list.
• ol = ordered list (numbers).
• ul = unordered list (bullets).

这篇关于正确的方法来制作HTML嵌套列表？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！