Foros aprenderaprogramar.com

Aprender a programar => C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más => Mensaje iniciado por: Boletos en 20 de Enero 2016, 01:17

Título: Colores HTML y CSS rgb CU01019D ejemplo selectores nth-child y first-child
Publicado por: 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!
Título: Re:Solución ejercicio 1019D aprende css desde cero
Publicado por: Ogramar 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
Título: Re:Solución ejercicio 1019D aprende css desde cero
Publicado por: Boletos 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.
Título: Re:Colores HTML y CSS rgb CU01019D ejemplo selectores nth-child y first-child
Publicado por: Ogramar 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
Título: Re:Colores HTML y CSS rgb CU01019D ejemplo selectores nth-child y first-child
Publicado por: Boletos en 26 de Enero 2016, 02:41
Gracias!!!