Ejercicios HTML 3 Listas
13
Ejercicios HTML 3 : LISTAS Ejercicio 3.1 listas_1 Código: <html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1> <!--A continuación empieza la lista --> <ul> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li> <li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ul> <!-- En la línea de encima acaba la lista --> </body> </html>
Transcript of Ejercicios HTML 3 Listas
Ejercicios HTML 3 : LISTAS
Ejercicio 3.1 listas_1
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1>
<!--A continuación empieza la lista --> <ul> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li> <li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ul> <!-- En la línea de encima acaba la lista -->
</body></html>
Ejercicio 3.2 listas_2
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1>
<!--A continuación empieza la lista --> <ul> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li>
<!--A continuación empieza la lista secundaria --> <ul> <li>De patatas</li> <li>De atún</li> <li>De jamón</li> <li>De chorizo</li> </ul> <!-- En la línea de encima acaba la lista secundaria -->
<li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ul> <!-- En la línea de encima acaba la lista -->
</body></html>
Ejercicio 3.3 listas_3
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1> <!--A continuación empiezan tres listas anidadas --> <ul> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li> <!-- Ahora empieza la segunda lista --> <ul> <li>De patatas</li> <li>De atún</li> <li>De jamón</li> <!-- Ahora empieza la tercera lista --> <ul> <li>De jamón serrano</li> <li>De jamón de York</li> </ul> <!-- Ha acabado la tercera lista --> <li>De chorizo</li> </ul> <!--Ha acabado la segunda lista --> <li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ul> <!--Ha acabado la primera lista -->
</body></html>
Ejercicio 3.4 listas_4
Código:
<html><head><title>Uso de listas</title></head><body><!--A continuación vemos que la indentación de las listas esindependiente de la del código --><h1><u>Menú de la casa.</u></h1><ul><li>Sopa castellana</li><li>Bacalao al Pil-Pil</li><li>Tortilla</li><ul><li>De patatas</li><li>De atún</li><li>De jamón</li><ul><li>De jamón serrano</li><li>De jamón de York</li></ul><li>De chorizo</li></ul><li>Ternera asada</li><li>Besugo al horno</li><li>Ternera encebollada</li></ul></body></html>
Ejercicio 3.5 listas_5
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1> <!-- Podemos anidar todas las listas que necesitemos --> <ul> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li> <ul> <li>De patatas</li> <li>De atún</li> <li>De jamón</li> <ul> <li>De jamón serrano</li> <ul> <li>Normal</li> <li>Superior</li> <li>Pata Negra</li> </ul> <li>De jamón de York</li> </ul> <li>De chorizo</li> </ul> <li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ul> <!-- Como ve, hay cuatro niveles de anidamiento --> </body></html>
Ejercicio 3.6 listas_6
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1> <!-- Podemos elegir los boliches que queramos para las listas --> <ul type="circle"> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li> <ul type="circle"> <li>De patatas</li> <li>De atún</li> <li>De jamón</li> <ul type="circle"> <li>De jamón serrano</li> <li>De jamón de York</li> </ul> <li>De chorizo</li> </ul> <li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ul> </body></html>
Ejercicio 3.7 listas_7
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1>
<!--A continuación empieza la lista --> <!-- Cada elemento va precedido por un número --> <ol> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li> <li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ol> <!-- En la línea de encima acaba la lista -->
</body></html>
Ejercicio 3.8 listas_8
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1>
<!-- Aquí empieza la lista principal --> <ol> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li>
<!-Aquí empieza una lista anidada --> <ol> <li>De patatas</li> <li>De atún</li> <li>De jamón</li> <li>De chorizo</li> </ol> <!-- Ha acabado la lista anidada -->
<li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ol> <!-- Ha acabado la lista principal -->
</body></html>
Ejercicio 3.9 listas_9
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1> <!-- Aquí empieza una lista numerada --> <ol> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li>
<!-- Aquí empieza una lista de viñetas --> <ul> <li>De patatas</li> <li>De atún</li> <li>De jamón</li> <li>De chorizo</li> </ul> <!--Ha terminado la lista de viñetas -->
<!-- Desde aquí sigue la lista numerada --> <li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ol> <!-- Ha terminado la lista numerada -->
</body></html>
Ejercicio 3.10 listas_10
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1>
<!-- A continuación empieza una lista numerada con LETRAS MAYÚSCULAS --> <ol type="A"> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li>
<!-- A continuación empieza una lista numerada con letras minúsculas --> <ol type="a"> <li>De patatas</li> <li>De atún</li> <li>De jamón</li> <li>De chorizo</li> </ol> <!-- Aquí acaba la lista con minúsculas-->
<li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ol> <!-- Aquí acaba la lista con MAYÚSCULAS -->
</body></html>
Ejercicio 3.11 listas_11
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <h1><u> Menú de la casa. </u></h1>
<!-- Aquí empieza una lista con números romanos en MAYÚSCULAS --> <ol type="I"> <li>Sopa castellana</li> <li>Bacalao al Pil-Pil</li> <li>Tortilla</li>
<!-- Aquí empieza una lista con números romanos en minúsculas --> <ol type="i"> <li>De patatas</li> <li>De atún</li> <li>De jamón</li> <li>De chorizo</li> </ol> <!-- Aquí sigue la lista con números romanos en MAYÚSCULAS -->
<li>Ternera asada</li> <li>Besugo al horno</li> <li>Ternera encebollada</li> </ol> <!-- Ya han acabado las dos listas -->
</body></html>
Ejercicio 3.12 listas_12
Código:
<html> <head> <title> Uso de listas </title> </head> <body>
<!-- La siguiente lista empieza a contar desde 3 --> <ol start=3> <li>Primer elemento de la lista</li> <li>Segundo elemento de la lista</li>
<!-- La siguiente lista empieza a contar desde la letra d --> <ol type="a" start=4> <li>Primer elemento de la sub-lista</li> <li>Segundo elemento de la sub-lista</li> </ol>
<li>Tercer elemento de la lista</li> </ol>
</body></html>
Ejercicio 3.13 listas_13
Código:
<html> <head> <title> Uso de listas </title> </head> <body> <!-- A continuación empieza la lista de definiciones --> <dl>Nombre de la lista <!-- A continuación aparece un término de la lista --> <dt>Término 1</dt> <!-- A continuación aparecen las definiciones para este término --> <dd>Primera definición del Término 1</dd> <dd>Segunda definición del Término 1</dd> <dd>Tercera definición del Término 1</dd> <!-- Empieza el segundo término --> <dt>Término 2</dt> <!-- Definiciones para el segundo término --> <dd>Primera definición del Término 2</dd> <dd>Segunda definición del Término 2</dd> <!-- Empieza el tercer término --> <dt>Término 3</dt>
<!-- Definiciones para el tercer término --> <dd>Primera definición del Término 3</dd> <dd>Segunda definición del Término 3</dd> <dd>Tercera definición del Término 3</dd> <dd>Cuarta definición del Término 3</dd>
<!-- Ahora acaba la lista --> </dl>
</body></html>
