L i s t a s

1. L i s t a s

2. Listas. HTML proporciona una etiqueta que permite generar en los documentos Web un listado, al cual se permite configurar una numeración o viñetas para sus elementos. • Las listas en html son clasificadas en dos tipos: • Listas Ordenadas • Listas No Ordenadas. Listas Ordenadas. Son aquellas cuyos elementos estas denotados por una secuencia numérica o alfabética. Listas No ordenadas. Son aquellas que denotas a sus elementos con un tipo de viñeta.

3. Listas Ordenadas

4. Listas Ordenadas Las listas ordenadas son iniciadas con la etiqueta <ol> y finalizadas con su complemento de fin de listas </ol>. Sintaxis. <ol> Elementos de la lista. </ol> Atributos.

5. Elementos de una lista. Para agregar elementos a una lista se debe utilizar la etiqueta <li> delimitando a cada elemento. • Sintaxis. • <li> Elemento de Lista </li> Atributos.

6. Listas ordenadas (sin atributos) Por default se contempla a la familia de números arábigos (1, 2,3, …) para la numeración.

7. Configuración familia de numeración Para configurar un tipo de numeración se utiliza el atributo type de la etiqueta <ol> En este caso se utiliza el atributo type para configurar una familia de numeración para la lista. Para este caso particular se elige la familia de números romanos en minúsculas.

8. Configurando inicio de numeración Para configurar un valor de inicio para la numeración se utiliza el atributo start de la etiqueta <ol> En este caso configuramos un tipo de numeración “romano minusculas”, con un valor de inicio en “7”

9. Configuración desde elementos de lista También se puede configurar el tipo de numeración para cada uno de los elementos de la lista mediante el atributo type de la etiqueta <li>. Configuracion del tipo de numeracion desde los elementos de una lista.

10. Listas No ordenadas

11. Listas no ordenadas Las listas no ordenadas son iniciadas con la etiqueta <ul> y finalizadas con su complemento de fin de listas </ul>. Sintaxis. <ul> Elementos de la lista. </ul> Atributos.

12. Listas no ordenadas La viñeta predefinida para una lista no ordenada es un circulo con fondo oscuro. Lista no ordenada con la viñeta predefinida.

13. Configurando viñetas Para configurar la viñeta para una lista no ordenada se utiliza el atributo type de la etiqueta <ul>. Este ejemplo configura una viñeta cuadrada a una lista no ordenada

14. Configurando viñetas También se puede configurar el tipo de viñeta para cada elemento de la lista. Este ejemplo configura un tipo de viñeta diferente para cada elemento de la lista.