Buenas noches. Este es el enunciado del ejercicio CU01023D del tutorial de programación web con CSS desde cero:
Crea un documento HTML que conste de los siguientes elementos: un título h1 con el texto “Aprendizaje de la programación”. Una división div con id menú que contenga: un título h2 con el texto “Menú” y una lista de elementos ordenados (ol) con los siguientes items: Programación básica, Programación intermedia y Programación avanzada. Finalmente, una división div con id footer con el texto “Curso aprenderaprogramar.com”. Establece diferentes valores de las propiedades color, background-color y font-size para:
a) Los elementos h1
b) Los elementos h2
c) Los elementos ol y partes internas a este (elementos li de listas).
d) El elemento con id footer.
A continuación utiliza el W3C validator y comprueba si no te indica ningún error, o qué errores o warnings te indica y trata de identificar el por qué de ellos y corregirlos.
Acá la aprobación de la página por parte de la W3C validator:
![](http://i.imgur.com/PqLNb1T.png)
Acá el acceso a la página en el servidor:
http://enigmaticnerd.byethost13.com/Ejercicio%20CU01023D%20Documentaci%C3%B3n%20especificaci%C3%B3n%20oficial%20CSS,%20w3c%20validator.htmlAcá el código:
<!DOCTYPE html>
<html lang="es">
<head>
<title>
CU01023
</title>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="estilosCU01023D.css"/>
</head>
<body>
<h1>Aprendizaje de la programación</h1>
<div id="menu">
<h2>Menú</h2>
<ol>
<li>Programación básica</li>
<li>Programación intermedia</li>
<li>Programación avanzada</li>
</ol>
</div>
<div id="footer">
<p>Curso aprenderaprogramar.com</p>
</div>
</body>
</html>
Estilos CSS:
/*Estilos para el título principal*/
h1{color:white;
background-color:rgba(0, 0, 0, 0.8);
font-size: 20px;
text-align: center;
}
/*Estilos para el título secundario*/
h2{color:silver;
background-color:black;
font-size: 20px;
text-align: center;
}
/*Estilos para la etiqueta ol*/
ol{color:blue;
background-color: silver;
text-align: center;
font-size:20px;
}
/*Estilos para los elementos li*/
ol li:first-child{background-color:beige;
color:blueviolet;
}
ol li:nth-child(2){background-color:bisque;
color:crimson;
}
ol li:last-child{background-color:salmon;
color:forestgreen;
}
/*Estilos para el id footer*/
#footer{background-color: aqua;
color:chocolate;
}
Si tienen correcciones o sugerencias, se las agradeceré enormemente. Gracias.