---
title: How to Use Lists
localeTitle: Cómo usar las listas
---
## Cómo usar las listas
Las listas se utilizan para especificar un conjunto de elementos consecutivos o información relacionada de forma bien formada y semántica, como una lista de ingredientes o una lista de pasos de procedimientos. El marcado HTML tiene tres tipos diferentes de listas: listas **ordenadas** , no **ordenadas** y listas de **descripción** .
### Listas ordenadas
Una lista ordenada se utiliza para agrupar un conjunto de elementos relacionados, en un orden específico. Esta lista se crea con la etiqueta `
` . Cada elemento de la lista está rodeado con la etiqueta `- ` .
##### Código
```html
- Mix ingredients
- Bake in oven for an hour
- Allow to stand for ten minutes
```
##### Ejemplo
1. Mezclar los ingredientes
2. Hornear en horno durante una hora
3. Dejar reposar durante diez minutos.
### Listas Desordenadas
Una lista desordenada se utiliza para agrupar un conjunto de elementos relacionados, sin ningún orden en particular. Esta lista se crea con la etiqueta `` . Cada elemento de la lista está rodeado con la etiqueta `- ` .
##### Código
```html
- Chocolate Cake
- Black Forest Cake
- Pineapple Cake
```
#### Ejemplo
* Pastel de chocolate
* Torta del bosque negro
* Pastel de piña
### Descripción de listas
Una lista de descripción se utiliza para especificar una lista de términos y sus descripciones. Esta lista se crea con la etiqueta `` . Cada elemento de la lista está rodeado con la etiqueta `- ` .
##### Código
```html
- Bread
- A baked food made of flour.
- Coffee
- A drink made from roasted coffee beans.
```
##### Salida
Pan de molde
Una comida al horno hecha de harina.
café
Una bebida hecha de granos de café tostados.
#### Lista de estilos
También puede controlar el estilo de la lista. Puede utilizar la propiedad de listas de `list-style` de lista. Su lista puede ser viñetas, cuadradas, en números romanos o puede ser imágenes que desee.
propiedad de `list-style` es una forma abreviada de `list-style-type` `list-style-position` `list-style-image` , `list-style-position` `list-style-image` , `list-style-image` .
#### Más información:
\[Listas HTML · Documentos de plataforma web\] (https://webplatform.github.io/docs/guides/html\_lists/ )