©
本文檔使用 php中文網手册 發布
HTML <ul> 元素表示的事物，典型地呈现为项目符号列表的无序列表。
内容类别 | Flow content, and if the <ul> element's children include at least one <li> element, Palpable content. |
|---|---|
允许的内容 | zero or more <li> elements, which in turn often contain nested <ol> or <ul> elements. |
标记遗漏 | None, both the starting and ending tag are mandatory. |
允许的双亲 | Any element that accepts flow content. |
允许的 ARIA 角色 | directory, group, listbox, menu, menubar, radiogroup, tablist, toolbar, tree, presentation |
DOM 接口 | HTMLUListElement |
属性
该元素包含全局属性。
compact这个布尔属性暗示列表应该以紧凑的风格呈现。该属性的解释取决于用户代理，并且不适用于所有浏览器。
用法说明：请勿使用此属性，因为它已被弃用：<ul>元素应使用 CSS 进行样式设置。为了提供与compact属性类似的效果，CSS 属性 line-height 可以与值80%一起使用。
type用于设置列表的项目符号样式。在 HTML3.2 和 HTML 4.0 / 4.01 的过渡版本中定义的值为：
circle,disc,and
square.
在 WebTV 界面中已经定义了第四种项目符号类型，但并非所有浏览器都支持它： triangle.
如果不存在，并且如果没有 CSS list-style-type 属性应用于元素，则用户代理根据列表的嵌套级别决定使用一种子弹。
用法说明：不要使用此属性，因为它已被弃用; 改用 CSS list-style-type属性。
使用说明
<ul>元素用于对一组没有数字排序的项目进行分组，并且它们在列表中的顺序没有意义。通常情况下，无序列表项用一个子弹显示，可以有几种形式，如点，圆形或方形。项目符号样式未在页面的 HTML 描述中定义，而是在其关联的 CSS 中使用list-style-type属性定义。使用
<ol>和<ul>元素定义的嵌套列表的深度和交替没有限制。在
<ol>和<ul>元素都代表项目的列表。它们的不同之处在于，对于<ol>元素而言，顺序是有意义的。作为决定使用哪一个的一个经验法则，尝试改变列表项的顺序; 如果含义发生了变化，<ol>则应使用该元素，否则可以使用<ul>。
示例
简单的例子
<ul> <li>first item</li> <li>second item</li> <li>third item</li></ul>
在 HTML 上会输出：
first item
second item
third item
嵌套列表
<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> <!-- Here is the closing </li> tag --> </li> <li>third item</li> </ul>
在 HTML 上会输出：
first item
second item
second item second subitem first sub-subitem
second item second subitem second sub-subitem
second item second subitem third sub-subitem
second item first subitem
second item second subitem
- second item third subitem
third item
嵌套 <ul> 和 <ol>
<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> <!-- Here is the closing </li> tag --> </li> <li>third item</li></ul>
在 HTML 上会输出：
first item
second item
second item first subitem
second item second subitem
second item third subitem
third item
规范
规范 | 状态 | 解释 |
|---|---|---|
HTML Living StandardThe definition of '<ul>' in that specification. | Living Standard | |
HTML5The definition of '<ul>' in that specification. | Recommendation |
浏览器兼容性
Feature | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
Basic Support | (Yes) | (Yes) | 1 | (Yes) | (Yes) | (Yes) |
compact | (Yes) | (Yes) | 1 | (Yes) | (Yes) | (Yes) |
type | (Yes) | (Yes) | 1 | (Yes) | (Yes) | (Yes) |
Feature | Android | Chrome for Android | Edge mobile | Firefox for Android | IE mobile | Opera Android | iOS Safari |
|---|---|---|---|---|---|---|---|
Basic Support | (Yes) | (Yes) | (Yes) | 1 | (Yes) | (Yes) | (Yes) |
compact | (Yes) | (Yes) | (Yes) | 1 | (Yes) | (Yes) | (Yes) |
type | (Yes) | (Yes) | (Yes) | 1 | (Yes) | (Yes) | (Yes) |