Las listas en HTML
El lenguaje HTML proporciona un modo sencillo de representar elementos en forma de lista. Dentro de una lista de puede incluir cualquiera de los elementos HTML, e igualmente una lista puede incluirse dentro de formularios, tablas, etc.
Existen principalmente tres tipos de listas: las listas no
ordenadas, las listas ordenadas y las listas de definiciones.
<UL> Listas no ordenadas
Este tipo de lista se usan para enumerar elementos que no tengan un orden definido. Se especificará con el elemento <UL>, todo lo que se incluya dentro de esta etiqueta y la de cierre formará la lista. Con los elementos <LI> se indicarán cada uno de los componentes de la lista. El formato es el siguiente:
<UL TYPE = DISK ó CIRCLE ó SQUARE >
<LH> Titulo de la lista </LH>
<LI> Elemento 1
<LI> Elemento 2
. . .
<LI> Elemento n
</UL>
Para marcar los distintos elementos de la lista se usarán unos símbolos, que pueden ser un disco (DISK), un circulo (CIRCLE) ó un cuadrado (SQUARE), seleccionables con el atributo TYPE.
Con la etiqueta <LH> definiremos el titulo de la lista, este es opcional y aparecerá en la parte superior de esta.
Igualmente es posible definir listas de varios niveles, que será listas anidadas, listas dentro de listas. Y combinar este tipo de lista con las que se explicarán en los proximos apartados.
| Ejemplos | |
|---|---|
| Inst. HTML |
<UL > <LH> Titulo </LH> <LI> Elemento 1 <LI> Elemento 2 <LI> Elemento 3 </UL> |
| Resul tado |
|
| Explica ción | Este será el caso básico de lista no ordenada. Se podrán incluir tantos elementos como se deseen y estos podrán ser texto normal, texto resaltado con alguno de los estilos, imágenes, etc ... |
| Inst. HTML |
|
|---|---|
| Resul tado |
|
| Explica ción | Ahora definimos una lista anidada, es decir una lista dentro de una lista, basta con incluir el nuevo elemento UL dentro del elemento UL de la lista original. En este ejemplo también usamos distintos elementos definibles con TYPE, para indicar los componentes de la lista. |
<OL> Listas ordenadas
Estas listas serán similares al caso anterior pero en este se usa un número para indicar el orden de cada elemento de la lista. El ser ordenada no significa que ordene los elementos alfabéticamente sino que los elementos guardan un orden que es el número que indexa la lista.
<OL START = n TYPE = A ó a ó I ó i ó 0 >
<LH> Titulo de la lista </LH>
<LI> Elemento 1
<LI> Elemento 2
. . .
<LI> Elemento n
</OL>
El punto de comienzo siempre será el 1 si no se indica en START con otro valor de comienzo y el tipo de numeración puede seleccionarse con el atributo TYPE. Sus posibles valores son:
| Ejemplos | |
|---|---|
| Inst. HTML |
<OL > <LI> Elemento 1 <LI> Elemento 2 <LI> Elemento 3 </OL> |
| Resul tado |
|
| Explica ción | Este será el caso básico de lista ordenada. |
| Inst. HTML |
|
|---|---|
| Resul tado |
|
| Explica ción | Ahora definimos una lista anidada y usamos distintos elementos para la numeración de las opciones. |
<DL> Listas de definiciones
En esta lista existirán dos elementos la definición y el termino, se usará principalmente para listas en las que se incluirán una palabra o frase y su definición (diccionario). El termino aparecerá pegado en el borde izquierdo y la definición aparecerá ligeramente tabulada a partir del borde izquierdo.
Se puede usar de forma separada la definición y el termino, pudiendo por tanto incluir solo definiciones o solo términos. El incluir solo términos podría usarse para sangrar el comienzo de un párrafo.
<DL>
<LH>Titulo de la lista </LH>
<DT>Termino 1
<DD>Definición 1
<DT>Termino 2
<DD>Definición 2
. . .
<DD>Termino N
<DT>Definición N
</DL>
El titulo de las lista <LH> como en los casos anteriores es opcional.
| Ejemplos | |
|---|---|
| Inst. HTML |
<DL > <DT> Coche <DD> Vehiculo de cuatro ruedas <DT> Moto <DD> Vehiculo de dos ruedas </DL> |
| Resul tado |
|
| Explica ción | Como se ve se coloca en una posición la definición y en otra el termino. |
| Ejemplos | |
|---|---|
| Inst. HTML |
|
| Resul tado | |
| Explica ción | En este ejemplo utilizaremos solo los elementos DD (definiciones) para crear un menu, en el que se incluyen tanto imágenes como texto. La lista de definiciones se utiliza para mostrar el menu de forma correcta con sus correspondientes niveles y subniveles. |
Es posible anidar cualquier tipo de lista entre sí, incluso listas de distinto tipo.
Conexión a la Red.
Normativa de conexión a Red.
Actualización del Software de
Comunicaciones.
Mensajería
Electrónica.