Handleiding HTML - CSS en tabellen

CSS		CSS en tabellen

Handleiding HTML Inhoud CSS | Inhoud HTML | Trefwoordenregister | Begin

Introductie CSS en tabellen

In dit onderdeel wordt beschreven hoe je CSS kunt gebruiken bij de presentatie van tabellen. Soms gaat het daarbij om alternatieven voor wat je ook met alleen HTML kunt bereiken, maar in de meeste gevallen biedt CSS allerlei extra mogelijkheden.

De weergave van de randen in een tabel kun je in HTML slechts in beperkte mate beïnvloeden. Je kunt bepalen of de browser randen wel of niet moet weergeven, hoe breed de buitenrand van de tabel moet zijn en welke ruimte moet worden vrijgehouden tussen de verschillende randen. Sommige browsers ondersteunen daarnaast attributen waarmee je de kleur van de randen kunt vastleggen, maar die maken geen deel uit van HTML 4.0. Met CSS heb je een groot aantal extra mogelijkheden tot je beschikking bij het bepalen van de weergave van tabelranden. Je kunt bijvoorbeeld de breedte, de kleur en de stijl van elke rand afzonderlijk vastleggen, maar ook de ruimte tussen de tabelranden in horizontale en verticale richting. Bovendien kun je ervoor kiezen de tabel niet zoals in HTML gebruikelijk weer te geven met gescheiden tabelranden (met ruimte tussen de verschillende randen), maar met samenvallende tabelranden.

In HTML kun je voor bepaalde tabelelementen een achtergrondkleur te definiëren. Sommige browsers ondersteunen bovendien een attribuut waarmee je kunt kiezen voor de weergave van een achtergrondafbeelding, maar deze mogelijkheid maakt geen deel uit van HTML 4.0. Met CSS kun je voor elk tabelelement vastleggen, dat de browser een kleur of afbeelding als achtergrond moet weergeven.

Als alternatief voor de attributen die je in HTML tot je beschikking hebt, kun je het uitlijnen van celinhoud ook regelen met CSS. Bij het bepalen van de ruimte tussen de celinhoud en de rand van de cel biedt CSS extra mogelijkheden.

De elementen waarmee kolommen worden gedefinieerd in HTML, nemen in de tabelopbouw een bijzondere positie in. Je kunt er daarom slechts een beperkt aantal eigenschappen voor gebruiken.

Als je wilt dat in bepaalde situaties niet de hele tabel wordt weergegeven, kun je met behulp van CSS kolommen en rijen verbergen.

Bij het berekenen van de afmetingen van de tabel houdt de browser standaard de methode van de automatische lay-out aan. Met CSS kun je aangeven dat de browser de tabel snel in een vaste lay-out moet weergeven.

CSS kun je ook gebruiken om te bepalen hoe de browser de tabel in horizontale richting moet uitlijnen en waar het bijschrift bij de tabel moet staan.

Tot de mogelijkheden die je alleen met CSS tot je beschikking hebt, behoren inline tabellen en tabellen zonder tabelelementen.

Van de voorbeelden in dit onderdeel zijn steeds naast elkaar een afbeelding met de correcte weergave en - in een rood omkaderd inline frame - de weergave door de browser te zien. Indien de browser geen inline frames ondersteunt, kan de weergave van de voorbeelden in een nieuw venster worden bekeken.

Incidenteel is vermeld welke browsers de gegeven voorbeelden ondersteunen. Voor het overige wordt verwezen naar de informatie over ondersteuning door browsers, die is opgenomen bij de beschrijving van de gebruikte eigenschappen.

Vervolg: Tabelranden

Inhoud onderdeel | Inhoud CSS | Inhoud HTML | Trefwoordenregister | Begin