Listas desordenadas
Es el tipo de lista más utilizada ya que nos permiten crear diferentes tipos de componentes de un sitio, tales como navegación, categorías y mucho más.
Creación de una lista desordenada
Una lista desordenada consta de dos etiquetas:
- Etiqueta <ul>
- Esta etiqueta de apertura y de cierre compone nuestra lista, el navegador entenderá que todos los elementos contenidos dentro de este bloque corresponde a una lista desordenada.
- Etiqueta <li>
- Esta etiqueta de apertura y de cierre debe envolver cada elemento que pertenezca a la lista.
Ejemplo
<ul>
<li>Chile</li>
<li>Argentina</li>
<li>Peru</li>
<li>Bolivia</li>
</ul>
Este código se transformará en:
- Chile
- Argentina
- Peru
- Bolivia
Listas ordenadas
La lista ordenada representa una serie de elementos que ocurren de manera cronológica o elementos ordenados de manera jerárquica.
Creación de una lista ordenada
Una lista ordenada se construye de la misma manera que una lista desordenada, con la diferencia que en vez de la etiqueta <ul>, debe utilizarse la etiqueta <ol>.
Ejemplo
<ol>
<li>Argentina</li>
<li>Chile</li>
<li>Ecuador</li>
<li>Uruguay</li>
</ol>
Este código se transformará en:
- Argentina
- Chile
- Ecuador
- Uruguay
La etiqueta <ul> puede contener el atributo "start" que define el número inicial de la lista.
Listas de definición
La lista ordenada representa una serie de elementos que ocurren de manera cronológica o elementos ordenados de manera jerárquica.
Creación de una lista ordenada
Las listas de definición crean una lista compuesta de un término y su definici&'oacute;n. Es similar a un diccionario.
Estas listas están compuestas de 3 etiquetas: <dl>(Definición de la lista), <dt>(Término a definir) y <dd>(Definición).
Ejemplo
<dl>
<dt>Richard Grayson</dt>
<dd>
Richard "Dick" Grayson es un personaje dentro del Universo DC. Fue conocido por ser el primer Robin.</dd>
<dt>Tim Drake</dt>
<dd>Timothy "Tim" Jackson Drake was known as Robin in the Batman comics, becoming the third character to take up the identity. </dd>
<dt>Jason Todd</dt>
<dd>Jason Todd es un personaje de DC Comics creado en 1983 y conocido como "el segundo Robin". El personaje era el reemplazo de Dick Grayson (Robin original) como aliado de Batman, ya que Grayson había crecido y se había convertido en el héroe Nightwing.
</dd>
<dt>Barbara Gordon</dt>
<dd>
Barbara Gordon es un personaje de DC Comics, se une a Batman y a Robin para luchar contra el crimen usando el apodo de Batgirl. Posteriormente ha adoptado el rol de Oráculo (Oracle en la versión original en inglés).
</dd>
</dl>
Este código se transformará en:
- Richard Grayson
- Richard "Dick" Grayson es un personaje dentro del Universo DC. Fue conocido por ser el primer Robin.
- Tim Drake
- imothy "Tim" Jackson Drake was known as Robin in the Batman comics, becoming the third character to take up the identity.
- Jason Todd
- Jason Todd es un personaje de DC Comics creado en 1983 y conocido como "el segundo Robin". El personaje era el reemplazo de Dick Grayson (Robin original) como aliado de Batman, ya que Grayson había crecido y se había convertido en el héroe Nightwing.
- Barbara Gordon
- Barbara Gordon es un personaje de DC Comics, se une a Batman y a Robin para luchar contra el crimen usando el apodo de Batgirl. Posteriormente ha adoptado el rol de Oráculo (Oracle en la versión original en inglés).
Importante
- Las listas y las etiqueta asociadas son elementos en bloque.
- Los elementos <li> y <dd>pueden contener cualquier tipo de elemento u otras etiquetas HTML.
- Los elementos <dt> no pueden contener otros elementos HTML.