Hola, es mi primera experiencia en subir (o intentarlo) un ejercicio resuelto: Espero que salga bien y sobre todo cumplir las normas establecidas. Pido disculpas si no es así.
En este ejercicio he tenido un verdadero quebradero de cabeza por una insignificante coma. ".a{background-color:rgba(178,34,34 aquí no había coma .1);}" Eso en todos los selectores class creados para el ejercicio. Cansado de buscar una solución acudí al foro y comprobé que todos utilizaban div en lugar de table, tr, td. Así que me cambié a div. Pero tampoco resultaba, claro seguía faltando la dichosa coma. Bueno debe ser cierto que quién la sigue la consigue, finalmente he visto el error y ahora me da igual la opción table o div. He personalizado un poco el ejercicio.
De cualquier forma planteo esta pregunta, ¿es mejor una opción que la otra? Por supuesto acepto con buena disposición cualquier sugerencia que mejore el ejercicio.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Colores transparencia 20</title>
<link rel="stylesheet" type="text/css" href="est.css">
</head>
<body>
<table>
<thead>
<tr class="k">
<th> Grados de transparencia desde 0.0 hasta 1.0 </th>
</tr>
</thead>
<tbody>
<tr class="y">
<td>RGB 178,34,34 0.0</td>
</tr>
<tr class="a">
<td>RGB 178,34,34 .1</td>
</tr>
<tr class="b">
<td>RGB 178,34,34 .2</td>
</tr>
<tr class="c">
<td>RGB 178,34,34 .3</td>
</tr>
<tr class="d">
<td>RGB 178,34,34 .4</td>
</tr>
<tr class="e">
<td>RGB 178,34,34 .5</td>
</tr>
<tr class="f">
<td>RGB 178,34,34 .6</td>
</tr>
<tr class="g">
<td>RGB 178,34,34 .7</td>
</tr>
<tr class="h">
<td>RGB 178,34,34 .8</td>
</tr>
<tr class="i">
<td>RGB 178,34,34 .9</td>
</tr>
<tr class="j">
<td>RGB 178,34,34 1.0</td>
</tr>
</tbody>
<thead>
<tr class="k">
<th>Grados de transparencia desde 1.0 hasta 0.0</th>
</tr>
</thead>
<tbody>
<tr class="l">
<td>RGB 218,165,32 1.0</td>
</tr>
<tr class="m">
<td>RGB 218,165,32 .9</td>
</tr>
<tr class="n">
<td>RGB 218,165,32 .8</td>
</tr>
<tr class="o">
<td>RGB 218,165,32 .7</td>
</tr>
<tr class="p">
<td>RGB 218,165,32 .6</td>
</tr>
<tr class="q">
<td>RGB 218,165,32 .5</td>
</tr>
<tr class="r">
<td>RGB 218,165,32 .4</td>
</tr>
<tr class="s">
<td>RGB 218,165,32 .3</td>
</tr>
<tr class="t">
<td>RGB 218,165,32 .2</td>
</tr>
<tr class="u">
<td>RGB 218,165,32 .1</td>
</tr>
<tr class="z">
<td>RGB 218,165,32 0.0</td>
</tr>
</tbody>
</table>
</body>
</html>
/*Estilos del ejercicio CU1020D*/
*{margin: 10px; padding:5px 5px;}
body{ border: 1px solid navy; width:80%; font-family: verdana; font-size: 22px;}
/*Estilos para los td en general*/
td{text-align: center;border: 1px solid orange; padding: .2em .21em;}
.k{background-color:#C9C9C9;}
/*Color de fondo para la primera serie de filas de la tabla*/
h4{text-align: center;border: 1px solid red; padding: .2em .1em;
background-color:#C9C9C9;}
.y{background-color:rgba(178,34,34,.0);}
.a{background-color:rgba(178,34,34,.1);}
.b{background-color:rgba(178,34,34,.2);}
.c{background-color:rgba(178,34,34,.3);}
.d{background-color:rgba(178,34,34,.4);}
.e{background-color:rgba(178,34,34,.5);}
.f{background-color:rgba(178,34,34,.6);}
.g{background-color:rgba(178,34,34,.7);}
.h{background-color:rgba(178,34,34,.8);}
.i{background-color:rgba(178,34,34,.9);}
.j{background-color:rgba(178,34,34,1.0);}
/*Color de fondo para la segunda serie de filas de la tabla*/
.l{background-color:rgba(218,165,32,1.0);}
.m{background-color:rgba(218,165,32,.9);}
.n{background-color:rgba(218,165,32,.8);}
.o{background-color:rgba(218,165,32,.7);}
.p{background-color:rgba(218,165,32,.6);}
.q{background-color:rgba(218,165,32,.5);}
.r{background-color:rgba(218,165,32,.4);}
.s{background-color:rgba(218,165,32,.3);}
.t{background-color:rgba(218,165,32,.2);}
.u{background-color:rgba(218,165,32,.1);}
.z{background-color:rgba(218,165,32,.0);}