Comment habiller un tableau avec un css

Les Différentes balises pour créer un tableau

Les balises de base

<table> : pour créer un tableau
<caption> : légende du tableau ( cette balise est optionnel )
<tr> : pour définir une ligne du tableau
<th> : pour définir une cellules d'en-tête du tableau
<td> : pour definir une cellules du tableau

Balises complémentaires

<thead> : groupe de cellules d'en-tête
<tbody> : groupe de cellules de corps de tableau
<tfoot> : groupe de cellules de pied de tableau

En pratique cela donne en html :

<table>
<caption>Tableau de données</caption>
<tr>
<th>Titre colonne 1</th>
<th>Titre colonne 2</th>
</tr>
<tr>
<td>cellule A1</td>
<td>cellule B1</td>
</tr>
<tr>
<td>cellule A2</td>
<td>cellule B2</td>
</tr>
</table>

Et cela donne :

Pour mettre ce tableau en forme, il faut definir une mise en page soit dans un css ou dans le head de la page

dans le css il faut redefinir les attributs du tableau. Exemple :

table {
border-collapse: collapse;
border: 1px solid #a4c7db;
font: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
color: #fff;
background: #151a25;
}
td, th {
color: #fff;
border: 1px solid #a4c7db;
padding: .3em;
font-family: Verdana, Arial, Helvetica, sans-serif;
}

Vous trouverez sur ce site des exemples d'habillage de tableaux : http://icant.co.uk/csstablegallery/