HTML参考手册
标签 | Elements
ul
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 first subitem
- second item second subitem
- second item second subitem first sub-subitem
- second item second subitem second sub-subitem
- second item second subitem third sub-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) |
标签 | Elements相关
超文本标记语言,它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不停止其解释执行过程,编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是,对于不同的浏览器,对同一标记符可能会有不完全相同的解释,因而可能会有不同的显示效果。