SPIP

[ar] [ast] [bg] [br] [ca] [co] [cpf] [cs] [da] [de] [en] [eo] [es] [eu] [fa] [fon] [fr] [gl] [id] [it] [ja] [lb] [nl] [oc] [pl] [pt] [ro] [ru] [sk] [sv] [tr] [vi] [zh] Espace de traduction

Télécharger

Styles des tableaux de SPIP

Juin 2006 — mis à jour le : Juillet 2008

Toutes les versions de cet article :

Les styles CSS permettent de paramétrer finement l’affichage des tableaux générés par SPIP.


Les tableaux constituent un moyen facile de présenter l’information en rangées et colonnes de cellules.
Pour tirer profit de cet article, mieux vaut connaître la syntaxe HTML des tableaux. La balise <table>, qui permet d’insérer un tableau dans la page, est l’une des balises les plus utilisées en HTML.

Les tableaux sont créés dans SPIP de la façon suivante :

||Légende du Tableau|Résumé du Tableau||
| {{Nom}} | {{Date de naissance}} | {{Ville}} |
| Jacques | 5/10/1970 | Paris |
| Claire | 12/2/1975 | Belfort |
| Martin | 1/31/1957 | Nice |
| Marie | 23/12/1948 | Perpignan |

ce qui produit cet affichage :

Légende du Tableau
Nom Date de naissance Ville
Jacques 5/10/1970 Paris
Claire 12/2/1975 Belfort
Martin 1/31/1957 Nice
Marie 23/12/1948 Perpignan

Les styles permettent de paramétrer finement l’affichage des tableaux :

-  table.spip permet de modifier le comportement général du tableau, notamment ses dimensions, ses marges et sa position (calé à gauche, centré, etc.) ;

-  table.spip caption concerne la légende (optionnelle) du tableau ;

-  table.spip tr.row_first concerne la « première ligne » du tableau (ici en jaune). Pour que la première ligne soit prise en compte comme rangée de titres, il faut que chacun des éléments qu’elle contient soient en gras ;

-  table.spip tr.row_odd et table.spip tr.row_even pour les autres lignes. Un des intérêts de ces styles est la possibilité d’appliquer deux couleurs différentes via « row_odd » et « row_even » (ici, gris clair et gris foncé), permettant d’alterner les couleurs d’une ligne à l’autre, ce qui facilite agréablement la lecture du tableau.

-  table.spip th et table.spip td concernent les cellules du tableau, et permettent, par exemple, de contrôler leur espacement intérieur (padding), afin d’aérer la présentation.


Voir le squelette de cette page Site réalisé avec SPIP | Espace de traduction | Espace privé