Programacion y Desarrollo Web: HTML Listas ordenadas y no ordenadas

HTML Listas ordenadas y no ordenadas

10/11/2009 | Posted in curso html, etiqueta li, etiqueta ol, etiqueta ul, html, listas no ordenadas, listas ordenadas

Existen 2 tipos de listas en html, las listas no ordenadas (que suelen constituir la base para crear nuestro menú de navegación) y las no ordenadas (que sirven solo para enumerar texto u ordenarlo), estas listas son un medio muy importante para poder estructurar el texto en un documento html, los dos tipos de listas siguen la siguiente sintaxis.-

||

|| < tipo_de_lista>

|| < li>Elemento 1< /li>

|| < li>Elemento 2< /li>

|| < /tipo_de_lista>

||

Entre los tipos de listas podremos encontrar los siguientes.-
Etiqueta UL .-(< ul>< /ul>) Nos sirve para crear listas de elementos sin orden alguno (cada elemento es presidido por una figura, la cual por defecto es un circulo pequeño), este tipo de lista permite los siguientes parámetros.-

Compact .- Muestra la lista mas compacta.
Type.- Nos indica el dibujo que precede al elemento, entre sus valores podremos encontrar disc, circle, square.

Etiqueta OL .-(< ol>< /ol>) Esta etiqueta nos permite presentar listas ordenadas de menor a mayor, precedido por su numero en orden y cuenta con los siguientes atributos.-

Compact .- Muestra la lista mas compacta.
Type .- Indica al navegar el tipo de numeración que precede al elemento, entre los valores de este atributo encontramos 1, a, A, i.
Star .-En este atributo pondremos el numero por el cual se empezara a contar los elementos de la lista.

Etiqueta LI .-(< li>< /li>)Esta etiqueta le indica al navegador mostrar el texto que se encuentra entre ellas como un elemento de linea en una lista, y cuenta con el atributo type, con el cual indicaremos que imagen precederá al elemento de la lista.-

Type=A .- Muestra letras mayúscula.
Type=a .- Muestra letras minúsculas.
Type=I .- Muestra números romanos grandes.
Type=i .- Muestra números romanos chicos.
Type=1 .- Muestra números arábigos.
Type=disc .- Muestra un circulo

Ejemplo de una lista no ordenada.-

||

|| < ul>

|| < li>Menu 1< /li>

|| < li>Menu 2< /li>

|| < li>Menu 3< /li>

|| < /ul>

||

El resultado del ejemplo anterior sera este, si la necesitas ordenada solo cambiaremos el tipo de lista por OL y utilizaremos el atributo type para asignarle el tipo de numeración a mostrar.