Autor Tema: CSS colores rgba con efecto transparencia distintos grados Ejercicio CU01020D (Leído 2298 veces)

Dimitar Stefanov · « **en:** 12 de Enero 2016, 15:50 »

De la siguiente manera me han quedado los 2 códigos del ejercicio CUO1020D del curso CSS desde cero.

Código HTML:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="keywords" content="programar,aprender">
	<meta name="description" content="Portal web aprenderaprogramar.com">
	<link rel="stylesheet" type="text/css" href="estilos23.css">
	<title>Ejemplo colores</title>
</head>
<body>
	<div id="page">
		<div>
		</div>
		<div id="wrapper">
			<div id="menu">
			</div>
			<div id="body">
				<span id="a"><<</>RGB 178,34,34 con transparencia 0.1>></span><br/>
				<span id="b"><<</>RGB 178,34,34 con transparencia 0.2>></span><br/>
				<span id="c"><<</>RGB 178,34,34 con transparencia 0.3>></span><br/>
				<span id="d"><<</>RGB 178,34,34 con transparencia 0.4>></span><br/>
				<span id="e"><<</>RGB 178,34,34 con transparencia 0.5>></span><br/>
				<span id="f"><<</>RGB 178,34,34 con transparencia 0.6>></span><br/>
				<span id="g"><<</>RGB 178,34,34 con transparencia 0.7>></span><br/>
				<span id="h"><<</>RGB 178,34,34 con transparencia 0.8>></span><br/>
				<span id="i"><<</>RGB 178,34,34 con transparencia 0.9>></span><br/>
				<span id="j"><<</>RGB 178,34,34 con transparencia 1.0>></span><br/>
				<span id="k"><<</>RGB 218,165,32 con transparencia 1.0>></span><br/>
				<span id="l"><<</>RGB 218,165,32 con transparencia 0.9>></span><br/>
				<span id="m"><<</>RGB 218,165,32 con transparencia 0.8>></span><br/>
				<span id="n"><<</>RGB 218,165,32 con transparencia 0.7>></span><br/>
				<span id="o"><<</>RGB 218,165,32 con transparencia 0.6>></span><br/>
				<span id="p"><<</>RGB 218,165,32 con transparencia 0.5>></span><br/>
				<span id="q"><<</>RGB 218,165,32 con transparencia 0.4>></span><br/>
				<span id="r"><<</>RGB 218,165,32 con transparencia 0.3>></span><br/>
				<span id="s"><<</>RGB 218,165,32 con transparencia 0.2>></span><br/>
				<span id="t"><<</>RGB 218,165,32 con transparencia 0.1>></span><br/>
			</div>
		</div>
		<div id="footer">
		</div>
	</div>
</body>
</html>

Código CSS: "estilos23.css"

Código: [Seleccionar]

#a {
	background-color: rgba(178,34,34,0.1);
}
#b{
	background-color: rgba(178,34,34,0.2); 
}
#c{
	background-color: rgba(178,34,34,0.3);
}
#d{
	background-color: rgba(178,34,34,0.4);
}
#e{
	background-color: rgba(178,34,34,0.5);
}
#f{
	background-color: rgba(178,34,34,0.6);
}
#g {
	background-color: rgba(178,34,34,0.7);
}
#h {
	background-color: rgba(178,34,34,0.8);
}
#i {
	background-color: rgba(178,34,34,0.9);
}
#j {
	background-color: rgba(178,34,34,1.0);
}
#k {
	background-color: rgba(218,165,32,1.0);
}
#l {
	background-color: rgba(218,165,32,0.9);
}
#m {
	background-color: rgba(218,165,32,0.8);
}
#n {
	background-color: rgba(218,165,32,0.7);
}
#o {
	background-color: rgba(218,165,32,0.6);
}
#p {
	background-color: rgba(218,165,32,0.5);
}
#q {
	background-color: rgba(218,165,32,0.4);
}
#r {
	background-color: rgba(218,165,32,0.3);
}
#s {
	background-color: rgba(218,165,32,0.2);
}
#t {
	background-color: rgba(218,165,32,0.1);
}

Como pueden observar, me refiero a los elementos mediante los selectores "#" porque no pude conseguir que funcionaran los selecontes: "nth-child(númerodehijo)", no sé porque.

Ogramar · « **Respuesta #1 en:** 15 de Enero 2016, 18:13 »

Hola dimiste veo el ejercicio bien resuelto

Hay algún fragmento que te sobra, por ejemplo

<div id="menu">
</div>

Supongo que se debe a que has copiado el código de otro ejercicio y se ha quedado eso suelto.

Sobre el uso de nth-child(númerodehijo) eso se explica en otra parte del curso, para ver cuál era el problema habría que ver el código.

Salu2

Dimitar Stefanov · « **Respuesta #2 en:** 15 de Enero 2016, 18:35 »

Gracias Ogramar,

Estoy intentando crear los códigos de la mejor forma posible (cosa muy difícil aún para mi, jeje). En el curso HTML desde cero nos han explicado la estructura por la cual creo los códigos HTML, por eso siempre intento meter el div id="menu", pero quizás tienes razón y no debería de ponerlo si no lo exige el ejercicio.

Saludos

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

Noticias: