<li>: elemento HTML de ítem de lista
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since julio de 2015.
El elemento HTML <li> se usa para representar un ítem dentro de una lista. Debe estar contenido en un elemento padre: una lista ordenada (<ol>), una lista desordenada (<ul>) o un menú (<menu>). En los menús y en las listas desordenadas, los ítems de lista suelen mostrarse con viñetas. En las listas ordenadas, suelen mostrarse con un contador ascendente a la izquierda, como un número o una letra.
Pruébalo
<p>Astronautas del programa Apolo:</p>
<ul>
<li>Neil Armstrong</li>
<li>Alan Bean</li>
<li>Peter Conrad</li>
<li>Edgar Mitchell</li>
<li>Alan Shepard</li>
</ul>
p,
li {
font:
1rem "Fira Sans",
sans-serif;
}
p {
font-weight: bold;
}
Atributos
Este elemento incluye los atributos globales.
value-
Este atributo entero indica el número de orden que le corresponde al ítem de lista dentro de la numeración definida por el elemento
<ol>. El único valor permitido para este atributo es un número, incluso si la lista se muestra con números romanos o letras. Los ítems de lista siguientes continúan la numeración a partir del valor establecido. Este atributo no tiene efecto en listas no ordenadas (<ul>) ni en menús (<menu>). type-
Este atributo de tipo carácter indica el tipo de numeración:
a: letras minúsculasA: letras mayúsculasi: números romanos en minúsculaI: números romanos en mayúscula1: números
Este tipo prevalece sobre el que use su elemento
<ol>padre, si lo hay.Nota: Este atributo ha quedado obsoleto; en su lugar, usa la propiedad CSS
list-style-type.
Ejemplos
Para ver ejemplos más detallados, consulta las páginas de <ol> y <ul>.
Lista ordenada
<ol>
<li>primer ítem</li>
<li>segundo ítem</li>
<li>tercer ítem</li>
</ol>
Resultado
Lista ordenada con un valor personalizado
<ol type="I">
<li value="3">tercer ítem</li>
<li>cuarto ítem</li>
<li>quinto ítem</li>
</ol>
Resultado
Lista desordenada
<ul>
<li>primer ítem</li>
<li>segundo ítem</li>
<li>tercer ítem</li>
</ul>
Resultado
Resumen técnico
| Categorías de contenido | Ninguna. |
|---|---|
| Contenido permitido | Contenido de flujo. |
| Omisión de etiquetas |
La etiqueta de cierre puede omitirse si el ítem de lista va seguido
inmediatamente de otro elemento <li>, o si no hay más
contenido en su elemento padre.
|
| Padres permitidos |
Un elemento <ul>, <ol> o
<menu>. Aunque no es un uso conforme, el elemento
obsoleto <dir> también puede ser su padre.
|
| Rol ARIA implícito |
listitem
cuando es hijo de un
ol, ul o
menu
|
| Roles ARIA permitidos |
menuitem,
menuitemcheckbox,
menuitemradio, option,
none, presentation,
radio, separator,
tab, treeitem
|
| Interfaz DOM | HTMLLIElement |
Especificaciones
| Specification |
|---|
| HTML # the-li-element |
Compatibilidad con navegadores
Véase también
- Otros elementos HTML relacionados con las listas:
<ul>,<ol>,<menu>y el obsoleto<dir>; - propiedades CSS que pueden resultar especialmente útiles para dar estilo al elemento
<li>:- la propiedad
list-style, para elegir cómo se muestra el marcador de cada ítem, - contadores CSS, para manejar listas anidadas complejas,
- la propiedad
margin, para controlar la sangría del ítem de lista.
- la propiedad