Styling van tabellen in SPIP

Met CSS kan de weergave van tabellen in SPIP worden aangepast.

Met CSS kan de weergave van tabellen in SPIP worden aangepast.

Tabellen vormen een eenvoudig middel om informatie in kolommen te rangschikken.
Om te kunnen profiteren van dit artikel, moet je op de hoogte zijn van de HTML-syntax van tabellen. Eén daarvan is de tag <table>, die je een tabel laat invoegen op een pagina.

Tabellen worden in SPIP op de volgende wijze gemaakt:

||Legende van de tabel|Samenvatting van de tabel||
| {{Naam}} | {{Geboortedatum}} | {{Plaats}} |
| Jacques | 5/10/1970 | Paris |
| Claire | 12/2/1975 | Belfort |
| Martin | 1/31/1957 | Nice |
| Marie | 23/12/1948 | Perpignan |

wat deze tabel zal opleveren:

Legende van de tabel
Samenvatting van de tabel
Naam Geboortedatum Plaats
Jacques 5/10/1970 Paris
Claire 12/2/1975 Belfort
Martin 1/31/1957 Nice
Marie 23/12/1948 Perpignan

We kunnen de weergaven van zo’n tabel aanpassen in een stylesheet:

-  table.spip bepaalt het algemene gedrag van de tabel, waaronder zijn afmetingen, marges en positie (links uitgelijnd, gecentreerd, enz.);

-  table.spip caption heeft betrekking op de (optionele) legende;

-  table.spip tr.row_first betreft de «eerste rij» van de tabel (hier in het geel). Hij wordt alleen zo weergegeven wanneer alle elementen in die rij in vetschrift staan aangegeven;

-  table.spip tr.row_odd en table.spip tr.row_even zijn voor de overige rijen. Een interessant aspect is dat je afwisselend twee verschillende kleuren kunt gebruiken via «row_odd» en «row_even» (hier licht- en donkergrijs), wat de leesbaarheid van de tabel vergroot.

-  table.spip th en table.spip td hebben betrekking op de cellen en laten onder meer toe de marges (padding) aan te passen.

Auteur Hanjo Gepubliceerd op:

Vertalingen: català, English, Español, français, italiano, Nederlands