HTML

Podemos distinguir tres tipos de listas: • Listas desordenadas • Listas ordenadas • Listas de definición Listas desordenadas.- Son delimitadas por las etiquetas <ul> y </ul> (unordered list). Cada uno de los elementos de la lista es citado por medio de una etiqueta <li> (sin cierre). Ejemplo: <p>Países del mundo</p> <ul> <li>Argentina <li>Perú <li>Chile </ul>

<ul type="tipo de viñeta"> Listas desordenadas Atributos de las etiqueta <ul> </ul> Type: Define el tipo de viñeta de cada elemento. Si queremos hacerlo específico de un solo elemento lo escribiremos dentro de la etiqueta <li>. La sintaxis es del siguiente tipo: <ul type="tipo de viñeta"> donde tipo de viñeta puede ser una de las siguientes: circle, disc, square. Style: Cambia el color de la lista con viñetas. Parámetro style="Color: nombrecolor". la siguiente línea de código aplica una viñeta de tipo cuadrada, con color de texto y viñeta azul. <ul type="square" style="color: Blue“>

Listas II: Listas ordenadas Listas ordenadas, en este caso usaremos las etiquetas <ol> (ordered list) y su cierre. Cada elemento será igualmente precedido de su etiqueta <li>. Type=tipo  Indica el tipo de numeración utilizada. Si no se indica se entiende que será lista ordenada numéricamente. Los tipos posibles son : 1 = Numéricamente. (1,2,3,4,... etc.) a = Letras minúsculas. (a,b,c,d,... etc.) A = Letras mayúsculas. (A,B,C,D,... etc.) i = Números romanos en minúsculas. (i.ii,iii,iv,v,.. etc.) I = Números romanos mayúsculas. (I,II,III,IV,... etc.) <ol type=“I" style="color: Blue” start=“5”>

Listas III: Listas de definición Cada elemento es presentado junto con su definición. La etiqueta principal es <dl> y </dl> (definition list). Las etiquetas del elemento y su definición son <dt> (definition term) y <dd> (definition definition) respectivamente. Ejemplo <p>PARTES DE LA COMPUTADORA</p> <dl> <dt>Pantalla: <dd>Dispositivo de salida de la computadora <dt>Teclado: <dd>Dispositivo de entrada de la computadora </dl>

Anidando listas Permite crear listas de una forma anidada. De esta forma, podemos conseguir listas mixtas como por ejemplo: <p>Ciudades del mundo</p> <ul> <li>Argentina <ol> <li>Buenos Aires <li>Bariloche </ol> <li>Uruguay <li>Montevideo <li>Punta del Este </ul>

Práctica