HTML5 <li> 标签
最后一次修改 2017年08月02日
实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>html(html.cn)</title> </head> <body> <p>有序列表:</p> <ol> <li>咖啡</li> <li>茶</li> <li>牛奶</li> </ol> <p>无序列表:</p> <ul> <li>咖啡</li> <li>茶</li> <li>牛奶</li> </ul> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
浏览器支持
目前多数主流浏览器支持 <li>标签。
标签定义及使用说明
<li> 标签定义列表项目。
<li> 标签可用在有序列表(<ol>)、无序列表(<ul>)和菜单列表(<menu>)中。
HTML 4.01 与 HTML5之间的差异
"type" 属性 在 HTML 4.01 已被废弃。HTML5 不支持该属性。
"value" 属性 在 HTML 4.01 已被废弃。HTML5 不支持该属性。
提示和注释
提示: 请使用 CSS 来定义列表和列表项目的类型。
属性
属性 | 值 | 描述 |
---|---|---|
type | 1 A a I i disc square circle |
HTML5 不支持该属性。HTML 4.01 已废弃该属性。 不赞成使用。请使用样式取代它。规定使用哪种项目符号。 |
value | number | 不赞成使用。请使用样式取代它。规定列表项目的数字。 |
全局属性
<li> 标签支持全局属性,查看完整属性表 HTML 全局属性。
事件属性
<li> 标签支持所有 HTML 事件属性。
实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>html(html.cn)</title> </head> <body> <h4>嵌套列表:</h4> <ul> <li>咖啡</li> <li>茶 <ul> <li>红茶</li> <li>绿茶</li> </ul> </li> <li>牛奶</li> </ul> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
列表内的列表。
实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>html(html.cn)</title> </head> <body> <h4>嵌套列表:</h4> <ul> <li>咖啡</li> <li>茶 <ul> <li>红茶</li> <li>绿茶 <ul> <li>中国</li> <li>非洲</li> </ul> </li> </ul> </li> <li>牛奶</li> </ul> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
更复杂的嵌套列表。
实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>html(html.cn)</title> </head> <body> <p>有序列表:</p> <ol> <li>咖啡</li> <li>茶</li> <li>牛奶</li> </ol> <p>无序列表:</p> <ul> <li>咖啡</li> <li>茶</li> <li>牛奶</li> </ul> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
浏览器支持
目前多数主流浏览器支持 <li>标签。
标签定义及使用说明
<li> 标签定义列表项目。
<li> 标签可用在有序列表(<ol>)、无序列表(<ul>)和菜单列表(<menu>)中。
HTML 4.01 与 HTML5之间的差异
"type" 属性 在 HTML 4.01 已被废弃。HTML5 不支持该属性。
"value" 属性 在 HTML 4.01 已被废弃。HTML5 不支持该属性。
提示和注释
提示: 请使用 CSS 来定义列表和列表项目的类型。
属性
属性 | 值 | 描述 |
---|---|---|
type | 1 A a I i disc square circle |
HTML5 不支持该属性。HTML 4.01 已废弃该属性。 不赞成使用。请使用样式取代它。规定使用哪种项目符号。 |
value | number | 不赞成使用。请使用样式取代它。规定列表项目的数字。 |
全局属性
<li> 标签支持全局属性,查看完整属性表 HTML 全局属性。
事件属性
<li> 标签支持所有 HTML 事件属性。
实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>html(html.cn)</title> </head> <body> <h4>嵌套列表:</h4> <ul> <li>咖啡</li> <li>茶 <ul> <li>红茶</li> <li>绿茶</li> </ul> </li> <li>牛奶</li> </ul> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
列表内的列表。
实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>html(html.cn)</title> </head> <body> <h4>嵌套列表:</h4> <ul> <li>咖啡</li> <li>茶 <ul> <li>红茶</li> <li>绿茶 <ul> <li>中国</li> <li>非洲</li> </ul> </li> </ul> </li> <li>牛奶</li> </ul> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
更复杂的嵌套列表。