En esta actividad, veremos los selectores, que le permiten tener más control sobre a qué reglas de CSS se aplican.
id el que identifica un solo elemento en la página. Debe ser único.id. Llamémoslo 'carlos'. <tr id="carlos">
<td>Carlos</td>
#. #carlos {
font-style: italic;
}
<tr> y todos los elementos dentro de él están en cursiva.id porque debe ser única.class a cada elemento que queremos cambiar. Llamémoslo 'edad'.<table>
<head>
<tr>
<th>Nombre</th>
<th>Apellido</th>
<th>Nacionalidad</th>
<th class="edad">Edad</th>
<th>Puesto</th>
</tr>
</thead>
<tbody>
<tr>
<td>David</td>
<td>Ospina Ramírez</td>
<td>Colombia</td>
<td class="edad">33</td>
<td>Portero</td>
</tr>
<tr id="carlos">
<td>Carlos</td>
<td>Eccehomo Cuesta Figueroa</td>
<td>Colombia</td>
<td class="edad">22</td>
<td>Defensa</td>
</tr>
<tr>
<td>Juan Guillermo</td>
<td>Cuadrado Bello</td>
<td>Colombia</td>
<td class="edad">33</td>
<td>Centrocampista</td>
</tr>
<tr>
<td>Radamel Falcao</td>
<td>García Zárate</td>
<td>Colombia</td>
<td class="edad">35</td>
<td>Delantero</td>
</tr>
</tbody>
</table>
.edad {
background-color: yellow;
}
background-color que establece el color de fondo. Esto se puede aplicar a cualquier elemento, incluido el <body> que cambiará el fondo de la página.#carlos .edad {
font-weight: 900;
}
td.edad {
font-size: 150%;
}