English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
HTML <li>标签在HTML文档的 <ol>， <ul>或 <menu>中定义了一个列表项。该标签通常也称为 <li>元素。
HTML 两个列表示例： 一个有序列表 (<ol>) 和 一个无序列表 (<ul>) :
!doctype html> <html> <head> <meta charset="UTF-8"> <title>HTML5 li标签的使用(基础教程网 oldtoolbag.com)</title> </head> <body> <ol> <li>First item</li> <li>Second item</li> <li>Third item</li> <li>Fourth item</li> </ol> <ul> <li>First item</li> <li>Second item</li> <li>Third item</li> </ul> <ul> <li>First item <ol> <li>Nested item A</li> <li>Nested item B</li> <li>Nested item C</li> <li>Nested item D</li> </ol> </li> <li>Second item</li> <li>Third item</li> <li>Fourth item</li> </ul> </body> </html>测试看看 ‹/›
在此HTML5文档示例中，我们有一个带有四个<li>列表项的有序列表<ol>标记。然后，我们有一个带有三个<li>列表项的无序列表<ul>标记。最后，我们在无序列表<ul>标记中嵌套了有序列表<ol>标记。
IEFirefoxOperaChromeSafari
目前多数主流浏览器支持 <li>标签。
<li> 标签定义列表项目。
<li> 标签可用在有序列表（<ol>）、无序列表（<ul>）和菜单列表（<menu>）中。
您可以嵌套<ol，<ul>和<menu>列表。
"type" 属性 在 HTML 4.01 已被废弃。HTML5 Este atributo não é suportado.
"value" 属性 在 HTML 4.01 已被废弃。HTML5 Este atributo não é suportado.
Dica: Use CSS para definir o tipo de lista e de item da lista.
| Atributo | Valor | Descrição |
|---|---|---|
| type | 1 A a I i disc square circle | HTML5 Este atributo não é suportado. HTML 4.01 Este atributo foi descontinuado. Desaconselhado. Use estilos para substituí-lo. Define qual tipo de marcador de lista usar. Valor de caractere, indica o estilo de numeração. Pode ser qualquer um dos seguintes valores: |
| value | number | Desaconselhado. Use estilos para substituí-lo. Define o número da lista do item. |
A etiqueta <li> suporta atributos globais, veja a tabela completa de atributos Atributos Globais do HTML.
A etiqueta <li> suporta todos Atributos de eventos HTML.
Listas ordenadas de diferentes tipos
Listas ordenadas de diferentes tipos
Listas não ordenadas de diferentes tipos
Listas não ordenadas de diferentes tipos
Listas aninhadas
Este exemplo demonstra como aninhar listas.
Listas aninhadas 2
Este exemplo demonstra listas aninhadas mais complexas.
Lista personalizada
Este exemplo demonstra uma lista definida.
Tutorial HTML: Lista HTML