Tableaux - CSS
Noter ce cours : 
Liens sponsorisés :
Les tableaux qui doivent être utilisés pour de la classification de données tabulaires (et non pour de la mise en page) sont personnalisables avec les CSS.
Fusionner deux bordures :
On utilise pour fusionner ou non deux bordures adjacentes la propriété border-collapse.
Cette propriété peut prendre les valeurs suivantes :
- collapse : "Colle" les deux bordures en une
- separate : Affiche les deux bordures distinctement.
Exemple :
table{
border-collapse:collapse;
}
Espacement entre les bordures et les cellules :
On utilise pour modifier l'espacement entre les cellules et les bordures la propriété border-spacing.
Exemple :
table{
border-spacing:2px;
}
Afficher les bordures des cellules vides :
Pour afficher ou non les bordures des cellules ne contenant aucun contenu visible on utilise la propriété empty-cells.
Elle peut prendre deux valeurs :
- show : Les bordures sont affichées.
- hide : Les bordures ne sont pas affichées.
Exemple :
table{
empty-cells:show;
}
Position de la légende du tableau :
On utilise la propriété caption-side pour modifier la position de la légende du tableau (qui se place dans une balise <legend></legend>).
Elle peut prendre plusieurs valeurs :
- top : La légende est affichée en haut
- bottom : La légende est affichée en bas
- left : La légende est affichée à gauche
- right : La légende est affichée à droite
Exemple :
table{
caption-side:top;
}