Tablas
- Área: Manual de estilo para el SGISI
- Tipo de pauta: Directriz
- Carácter de la pauta: Obligatoria
Personalización de las tablas de datos para la SGISI
Pautas
Título | Carácter |
---|---|
Bordes | Obligatoria |
Cabecera | Obligatoria |
Fila seleccionada | Obligatoria |
Colores filas consecutivas | Obligatoria |
Ubicación enlaces | Obligatoria |
Cabecera
Utilizar el color #666666 para el texto de las cabeceras y el color #DFDFDF para el fondo.
Ejemplo de uso:
Código html:
<table class="listado>
...
<th>Columna 002</th>
...
</table>
Código CSS:
.listado th {
background-color: #DFDFDF;
color: #666666;
}
Fila seleccionada
Poner en negrita el texto de la fila seleccionada.
Ejemplo de uso:
Código html:
<table class="listado">
<tr class="seleccionada">
<td>Fila seleccionada</td>
...
</tr>
...
</table>
Código CSS:
.listado tr.seleccionada td {
background-color: #E7F0E1;
font-weight: bold;
}
Colores filas consecutivas
Alternar los colores de fondo blanco y #F4F4F4 en las filas de las tablas de datos, comenzando por el blanco.
Para diferenciar mejor las distintas filas de las tablas de datos se alterna con dos colores de fondo, comenzando la primera fila de la tabla con el blanco.
Ubicación enlaces
Colocar los enlaces para imprimir y exportar un listado encima del mismo y los enlaces de la paginación debajo.