--- title:
HTML <ul>
元素(或称 HTML 无序列表元素)表示一个内可含多个元素的无序列表或项目符号列表。
内容分类 | 流式内容,如果 <ul> 包含至少一个 <li> 元素,那么它就是显性内容 Palpable content。 |
允许的内容 | 零个或更多个 {{HTMLElement("li")}} 元素,可以混合使用 {{HTMLElement("ol")}} 与{{HTMLElement("ul")}} 元素。 |
标签省略 | {{no_tag_omission}} |
允许的父元素 |
接受流文本的任何内容 |
Permitted ARIA roles | {{ARIARole("directory")}}, {{ARIARole("group")}}, {{ARIARole("listbox")}}, {{ARIARole("menu")}}, {{ARIARole("menubar")}}, {{ARIARole("radiogroup")}}, {{ARIARole("tablist")}}, {{ARIARole("toolbar")}}, {{ARIARole("tree")}}, {{ARIARole("presentation")}} |
---|---|
DOM 接口 | {{domxref("HTMLUListElement")}} |
此元素仅含有全局属性。
compact
属性相同的效果,将 CSS 属性 line-height 的值设为 80%
即可。circle
disc
square
第四种着重号样式被定义在 WebTV 接口中,但并不是所有浏览器都支持: triangle
如果未设置此 HTML 属性且没有 CSS {{ cssxref("list-style-type") }} 属性作用于这个元素,用户代理会决定使用哪种着重号样式,一般来说这也和嵌套的层级数有关。
<ul>
元素用来将没有数字顺序的一组数据进行分组,并且它们的数字顺序是没有意义的。举个例子,无序列表的列表项通常通过一个字符进行装饰,这些字符的形式可以是点,圆乃至方形.虽然这个字符没有直接在页面上定义,但是可以用与之相关的 CSS 对其进行操作,例如使用 {{cssxref("list-style-type")}} 属性。<ul> <li>first item</li> <li>second item</li> <li>third item</li> </ul>
以上HTML输出:
<ul> <li>first item</li> <li>second item <!-- Look, the closing </li> tag is not placed here! --> <ul> <li>second item first subitem</li> <li>second item second subitem <!-- Same for the second nested unordered list! --> <ul> <li>second item second subitem first sub-subitem</li> <li>second item second subitem second sub-subitem</li> <li>second item second subitem third sub-subitem</li> </ul> </li> <!-- Closing </li> tag for the li that contains the third unordered list --> <li>second item third subitem</li> </ul> </li> <!-- Here is the closing </li> tag --> <li>third item</li> </ul>
以上HTML输出:
<ul> <li>first item</li> <li>second item <!-- Look, the closing </li> tag is not placed here! --> <ol> <li>second item first subitem</li> <li>second item second subitem</li> <li>second item third subitem</li> </ol> </li> <!-- Here is the closing </li> tag --> <li>third item</li> </ul>
以上HTML输出:
规范 | 状态 | 评论 |
---|---|---|
{{SpecName('HTML WHATWG', 'semantics.html#the-ul-element', '<ul>')}} | {{Spec2('HTML WHATWG')}} | |
{{SpecName('HTML5 W3C', 'grouping-content.html#the-ul-element', '<ul>')}} | {{Spec2('HTML5 W3C')}} |
{{Compat("html.elements.ul")}}
{{ languages({ "en":"en/HTML/Element/ul", "de":"de/HTML/Element/ul", "ja":"ja/HTML/Element/ul", "pl":"pl/HTML/Element/ul"}) }}