Autor Tema: Documentación especificación oficial CSS validación W3C validator. CU01023D (Leído 3267 veces)

Lorenzo31 · « **en:** 14 de Febrero 2016, 18:09 »

Buenas entrego mi ejercicio, la verdad que aun me veo muy pez en esto del CSS, ya quisiera poder hacer muchas cosas más, en fin poco a poco.

La validación me dio todo correcto en w3.

Código: [Seleccionar]

<!DOCTYPE html>
<html>
	<head> 
		<meta charset="utf-8"/> 
		<link rel="stylesheet" type="text/css" href="estilos122D.css"/>
	</head>
	<body>
		<div id="header"> <h1>Aprendizaje de la programación</h1> </div>
		<div id="menu"> 
			<h2>Menú</h2> 
			<ul> 
				<li>Programación básica</li>
				<li>Programación intermedia</li>
				<li>Programación avanzada</li>
			</ul>
		</div>
		<div id="footer">Curso aprenderaprogramar.com</div>
	</body>
</html>

estilos122D.css

Código: [Seleccionar]

h1 {background-color:#315CFF; color:#FF0000; font-size:300%; margin:0px; text-align:center;}
h2 {background-color:#FF0000; color:#315CFF; font-size:200%; margin:0px;}
ul, ul li { background-color:#000000; color:#FFFFFF; font-size:120%; margin:0px; width:45%; }
#footer { background-color: #66FF00; color:#CC00CC; font-size:80%; position:absolute; bottom:0; left:0; width:100%; }

Mario R. Rancel · « **Respuesta #1 en:** 16 de Febrero 2016, 09:00 »

Buenos días, todo de acuerdo con lo que se pedía en el ejercicio y como comentas tendrás que ir poco a poco. Otra opción es usar frameworks que te permiten ir muy rápido, pero en ese caso no aprendes los fundamentos, sino aprendes a usar el framework. Pero es otra opción...

Un comentario:

ul, ul li { background-color:#000000; color:#FFFFFF; font-size:120%; margin:0px; width:45%; }

Aquí aplicas un width de 45% a ul, y un width de 45% a elementos li dentro de ul. Esto significa que el elemento ul ocupará el 45% de lo que ocupa el padre y el elemento li un 45% de lo que ocupa el ul. Es decir, que aplicas una reducción dos veces, el efecto es que el texto del menú se apelotona hacia la izquierda al no poder abarcar todo el ancho del ul, sino sólo el 45% de este elemento

Saludos

Lorenzo31 · « **Respuesta #2 en:** 16 de Febrero 2016, 12:06 »

Prefiero aprender poco a poco pero bien, no usaré framworks por lo que comentas, no sabes que estás haciendo realmente.

Muy interesante lo que me comentas. es cierto, lo que debería haber hecho entonces, para compartir algunas propiedades entre ellos pero no el width seria

ul, ul li { background-color:#000000; color:#FFFFFF; font-size:120%; margin:0px; }
ul { width:45%; }

Algo así sería? Gracias Mario por el comentario, me ayuda mucho.

Mario R. Rancel · « **Respuesta #3 en:** 18 de Febrero 2016, 10:49 »

Sí, la idea es agrupar todas las propiedades comunes y sólo poner por separado las que apliquen únicamente a ciertos elementos. De ese modo evitas repetir código.

Saludos

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias:

Autor Tema: Documentación especificación oficial CSS validación W3C validator. CU01023D (Leído 3267 veces)

Lorenzo31

Documentación especificación oficial CSS validación W3C validator. CU01023D

Mario R. Rancel

Re:Documentación especificación oficial CSS validación W3C validator. CU01023D

Lorenzo31

Re:Documentación especificación oficial CSS validación W3C validator. CU01023D

Mario R. Rancel

Re:Documentación especificación oficial CSS validación W3C validator. CU01023D

Preguntas y respuestas