Autor Tema: Colores HTML y CSS rgb CU01019D ejemplo selectores nth-child y first-child (Leído 3086 veces)

Boletos · « **en:** 20 de Enero 2016, 01:17 »

Hola!

Dejo mi solución del archivo .css.

El código html no lo dejo porque ya no recordaba como se creaban tablas y lo tuve que copiar. Entonces no tiene interés.

Código: [Seleccionar]

th{border:1px solid;}
th{background-color:#FAFAFA;}
table tr:first-child+tr td:first-child{background-color:DimGray;}
table tr:first-child+tr td:nth-child(2){background-color:#696969;}
table tr:first-child+tr td:nth-child(3){background-color:rgb(105,105,105);}
table tr:nth-child(3) td:first-child{background-color:IndianRed;}
table tr:nth-child(3) td:nth-child(2){background-color:#CD5C5C;}
table tr:nth-child(3) td:nth-child(3){background-color:rgb(205,92,92);}
table tr:nth-child(4) td:first-child{background-color:FireBrick;}
table tr:nth-child(4) td:nth-child(2){background-color:#b22222;}
table tr:nth-child(4) td:nth-child(3){background-color:rgb(178,34,34);}
table tr:nth-child(5) td:first-child{background-color:DodgerBlue;}
table tr:nth-child(5) td:first-child+td{background-color:#1E90FF;}
table tr:nth-child(5) td:last-child{background-color:rgb(30,144,255);}
table tr:nth-child(6) td:first-child{background-color:Indigo;}
table tr:nth-child(6) td:first-child+td{background-color:#4B0082;}
table tr:nth-child(6) td:last-child{background-color:rgb(75,0,130);}

Seguro que hay forma de abreviar todo esto.

Fuí cambiando la forma de seleccionar para que no fuese tan repetitivo.

Un saludo!

Ogramar · « **Respuesta #1 en:** 21 de Enero 2016, 09:18 »

Buenas Boletos

Aunque creas que el código html no tiene interés sí lo tiene porque quien vaya a revisar el ejercicio así lo tendrá directamente y no tendrá que buscarlo, así nos facilitamos el poder ayudarnos unos a otros lo más fácil posible

Y otro detalle para los títulos incluir sobre qué trata el ejercicio y el código completo, de esta forma cuando queremos buscar soluciones al ejercicio podemos escribir en el buscador el código y encontrar soluciones planteadas, comentarios, etc.

Pega por favor el código HTML por lo que te he comentado

Salu2

Boletos · « **Respuesta #2 en:** 21 de Enero 2016, 11:34 »

Hola! Ogramar.
Ahí va el código html

Código: [Seleccionar]

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="description" content="Ejer 1019D">
		<meta name="keywords" content="ejercicio colores">
		<link rel="stylesheet" type="css/text" href="Colores.css">
		<title>Ejer 1019D Cajas de colores</title>
	</head>
	<body>
		<div id="page">
			<div id="header">
			</div>
			<div id="wrapper">
				<div id="menu">
				</div>
				<div id="body">
					<table>
						<tr>
							<th>Nombre</th>
							<th>Hexadecimal</th>
							<th>RGB</th>
						</tr>
						<tr>
							<td>DimGray</td>
							<td>696969</td>
							<td>105,105,105</td>
						</tr>
						<tr>
							<td>IndianRed</td>
							<td>CD5C5C</td>
							<td>205,92,92</td>
						</tr>
						<tr>
							<td>FireBrick</td>
							<td>B22222</td>
							<td>178,34,34</td>
						</tr>
						<tr>
							<td>DodgerBlue</td>
							<td>1E90FF</td>
							<td>30,144,255</td>
						</tr>
						<tr>
							<td>Indigo</td>
							<td>4B0082</td>
							<td>75,0,130</td>
						</tr>
					</table>
				</div>
			</div>
			<div id="footer">
			</div>
		</div>
	</body>
</html>

Entonces el título quedaría así?:
"Solución al ejercicio CU01019D sobre Colores HTML y CSS.
Disculpa la torpeza.
Un saludo.

Ogramar · « **Respuesta #3 en:** 21 de Enero 2016, 18:54 »

Buenas Boletos, lo veo perfecto

Sobre el título, sí, podría ser como lo has puesto o "Colores HTML y CSS notación rgb, hexadecimal y nombres ejercicio CU01019D" de esta forma cuando busques en el buscador por ejemplo rgb te aparecerá este ejercicio.

Para que quede más visible puedes subirle el tamaño de fuente escribiendo el selector * {font-size:48px;}

Realmente tienes que aplicar un selector para dotar de estilos a cada celda. Los selectores que has usado son un poco difíciles de entender y de leer, posiblemente lo más fácil de leer sería ponerle un id a cada celda y luego aplicar estilos por id, pero lo que has hecho te sirve para practicar con selectores.

Salu2

Boletos · « **Respuesta #4 en:** 26 de Enero 2016, 02:41 »

Gracias!!!

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

Noticias:

Autor Tema: Colores HTML y CSS rgb CU01019D ejemplo selectores nth-child y first-child (Leído 3086 veces)

Boletos

Colores HTML y CSS rgb CU01019D ejemplo selectores nth-child y first-child

Ogramar

Re:Solución ejercicio 1019D aprende css desde cero

Boletos

Re:Solución ejercicio 1019D aprende css desde cero

Ogramar

Re:Colores HTML y CSS rgb CU01019D ejemplo selectores nth-child y first-child

Boletos

Re:Colores HTML y CSS rgb CU01019D ejemplo selectores nth-child y first-child

Preguntas y respuestas