Tipos de listas en Html
En este tutorial aprenderemos a utilizar los diferentes tipos de listas que existen en HTML: ordenadas, no ordenadas y de definiciones.Listas ordenadas
Las listas ordenadas se crean con la etiqueta <ol> (ordered list) y cada uno de sus elementos con <li> (list item). Se creará automáticamente un número por cada elemento de la lista. Ejemplo de lista ordenada<ol>
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ol>
Listas no ordenadas
Las listas no ordenadas se crean con la etiqueta <ul> (unordered list) y cada elemento con <li> (list item). En lugar de un número, por cada elemento de la lista se creará un punto. Ejemplo de lista no ordenada:<ul>
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ul>
Podemos definir en cada <li> qué tipo de símbolo queremos que preceda al contenido: disc, circle, square o none. Si no ponemos ninguno se usará el que viene por defecto.
Ejemplo
<ul>
<li type="disc">Elemento 1</li>
<li type="circle">Elemento 2</li>
<li type="square">Elemento 3</li>
<li type="none">Elemento 4</li>
</ul>
Si ponemos el tipo en la etiqueta <ul> todos los elementos tendrán ese valor.
Ejemplo
<ul type="circle">
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ul>
Listas de definición
Las listas de definición se utilizan, como su nombre indica, para hacer definiciones de términos. Se crean con la etiqueta <dl> (definition list) y cada uno de los términos con <dt> (definition term). Dentro de cada término irá su descripción con la etiqueta <dd> (definition description). Ejemplo de lista de definición<dl>
<dt>Término 1</dt>
<dd>Definición del término 1</dd>
</dl>
<dl>
<dt>Término 2</dt>
<dd>Definición del término 2</dd>
</dl>
Más tutoriales de HTML y CSS
Si te ha gustado no olvides compartir en redes sociales.
Espero que te haya servido. Cualquier duda deja un comentario. Un saludo