CSS se usa para controlar la presentación de documentos de forma más precisa que HTML. CSS ofrece beneficios como controlar la presentación desde una hoja de estilo, aplicar estilos a diferentes medios, y usar técnicas avanzadas. Las tablas CSS tienen propiedades como la posición del título y el espaciado entre bordes, y se componen de encabezamientos, celdas y títulos. Las tablas requieren espacio, relleno y un tratamiento adecuado de su contenido.

1. ¿QUE ES CSS?
Muchas de las propiedades que se usan
en las hojas de estilo en cascada (CSS)
son parecidas a las de HTML. Así pues,
si estás acostumbrado a usar HTML
para cuestiones de presentación, lo más
probable es que reconozcas gran parte
del código usado. Examinemos un
ejemplo concreto.

2. ¿QUÉ DIFERENCIA HAY ENTRE
CSS Y HTML?
Beneficios que ofrece CSS:
• Control de la presentación de muchos documentos desde una única hoja de estilo;
• Control más preciso de la presentación;
• Aplicación de diferentes presentaciones a diferentes tipos de medios (pantalla,
impresión, etc.);
• Numerosas técnicas avanzadas y sofisticadas.

3. ¿QUÉ SON TABLAS CSS?

4. REGLAS GENERALES PARA UN ESTILO DE
TABLA
• Tablas aman espacio .
• Las células necesitan algo de relleno
• Tratar tablas la manera de tratar el
contenido

5. PROPIEDADES DE LAS TABLAS
Propiedad Descripción
caption-side Posición del título respecto de la tabla.
table-layout Control del algoritmo usado para el formato de
las celdas, filas y columnas.
border-collapse Selección del modelo de los bordes.
border-spacing Espaciado entre los bordes de celdas
adyacentes.
empty-cells Visibilidad de los bordes de celdas sin
contenido.

6. ESTRUCTURA DE LAS TABLAS
Antes de centrarnos en el CSS, fijémonos en los
elementos estructurales básicos de las tablas a las
que deberás aplicar estilos:
• Encabezamientos de las tablas.
• Celdas de datos de las tablas.
• Títulos de las tablas.

7. .normal
{Width: 250px
border: 1px solid #000;}
.normal th, .normal td
{boder: 1px solid #000;}
<table class=“normal” summary=“tabla genérica”>
<tr>
<th scope=“col”>A</th>
<th scope=“col”>B</th>
<th scope=“col”>C</th>
<th scope=“col”>D</th>
<th scope=“col”>E</th>
</tr>
</table>

8. PARTICULARIDADES DE LAS TABALS EN
CSS
• Bordos
• Márgenes
• Fondos