Foros aprenderaprogramar.com

Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: Lorenzo31 en 08 de Febrero 2016, 16:16

Título: HTML y CSS en qué orden se aplican los selectores de fuera hacia dentro CU01013D
Publicado por: Lorenzo31 en 08 de Febrero 2016, 16:16
Buenas, aquí dejo mi respuesta al ejercicio, aunque no se si estara del todo bien, allá va.

Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<title>Portal web - aprenderaprogramar.com</title>
<meta name="description" content="Portal web aprenderaprogramar.com">
<meta name="keywords" content="aprender, programar, cursos, libros"><meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="estilos113DFinal.css"/>
</head>
<body>
<div class="principal"><h1>Novedades</h1><p>Aquí presentamos las novedades del sitio.</p></div>
<div class="secundario"><h3>Lanzamos el producto <span>X-FASHION</span></h3>
<p>Este producto permite estirar la piel hasta dejarla como la de un bebé.</p>
<p><img src="http://i.imgur.com/tq5Bs.png" title="Imagen del producto" alt="imagen producto x-fashion" /></p>
</div>
<div class="secundario"><h3>Mejoramos el producto T-MOTION</h3>
<p>Hemos lanzado una nueva versión del producto <span>T-MOTION</span></p>
<p><img src="http://i.imgur.com/SpZyc.png" title="Imagen del proudcto tmotion" alt="imagen producto tmotion" /></p>
</div>
</body>
</html>



estilos113DFinal.css

Código: [Seleccionar]
/* Estilos CSS Ejercicio113DFinal */
body { font-family:Arial; }
.principal h1 { color:red; text-size:130%; }
.secundario h3 { color:green; text-size:110%; }
.secundario h3 span { background-color:yellow; }
Título: Re:Concepto de herencia en hojas de estilo CSS. 1013D
Publicado por: Mario R. Rancel en 10 de Febrero 2016, 09:50
Buenos días

Un veterano como tú debería escribir los códigos completos, CU01013D, por aquello de que las consultas a bases de datos encuentren el hilo cuando se busque el código  ::)

Viendo el ejercicio... el apartado a) bien resuelto.

El apartado b) y c) me parece que te has inventado la propiedad text-size ya que debería ser font-size

Apartados d) y e) bien resueltos

Una cosa a recordar es que .secundario h3 span { ... } significa "estilos a aplicar a span dentro de h3 dentro de elementos con class sencundario". Si escribiéramos span h3 .secundario significaría "elementos con class secundario dentro de elementos h3 dentro de elementos span".

Saludos
Título: Re:HTML y CSS en qué orden se aplican los selectores de fuera hacia dentro CU01013D
Publicado por: Lorenzo31 en 10 de Febrero 2016, 14:54
Buenas Mario, si, fallo mio no poner todo el código, tomo nota que para las busquedas luego lo agradecemos todos :).

Ostras, text-size pues realmente al visualizarlo juro se veia más grande :) font-size, ahora mismo lo corrijo.

Y el aporte, super interesante.

.secundario h3 span {..} modifica todos los span, dentro de h3 con class = secundario.

span h3 .secundario {..} modificaria todo elemento con class = secundario, siempre que vayan dentro de un h3, que a su vez vaya dentro de un span.

Genial, lo apunto, tiene sentido, así voy asimilando la sintaxis CSS, la verdad que este curso es super extenso y completo, es brutal. Felicitar a César por ello.

estilos113DFinal.css
Código: [Seleccionar]
/* Estilos CSS Ejercicio113DFinal */
body { font-family:Arial; }
.principal h1 { color:red; font-size:130%; }
.secundario h3 { color:green; font-size:110%; }
.secundario h3 span { background-color:yellow; }