CSS2.
© 2006 H.M. Pragt
Cascading Style Sheets (afgekort tot CSS) is een techniek voor de stijl (vormgeving) van
webpagina's. De informatie over de vormgeving kan in het HTML document zelf staan maar ook
in een extern bestand. De verzameling van stijl regels noemen we stylesheet. In het begin
renderde iedere browser de HTML op een vast wijze waardoor iedereen die een beetje af wilde
wijken van de standaard vormgeving allerlei truuks ging toepassen om dit te realiseren. Het
aantal atributen van HTML tags groeide ook gestaag en kon de vraag naar nieuwe vormgeving
niet bijbenen. Door middel van CSS was de vormgeving en de HTML opmaak te scheiden, de
HTML codering geeft alleen de structuur weer de presentatie zit in de stylesheet.
Met Cascading Style Sheets kan de vormgeving van elk element in een webpagina worden bepaald.
Een element van een webpagina wordt gedefinieerd door het gebruik van een HTML tag. De term
cascading geeft aan dat de stijl van elementen overerving vertoont: elk element heeft neemt
de stijl over van zijn parent element, tenzij er een eigen stijl voor dat element is gegeven.
Elke webbrowser heeft een ingebouwde stylesheet die de vormgeving van alle elementen bepaalt
als er geen stylesheets aan een document worden meegegeven.
Een stijl bestaat uit een aantal aspecten zoals lettertype en voor- en achtergrondkleur. Ook
breedte van kantlijnen, de horizontale en verticale positie, de zichtbaarheid, de transparantie,
of een element boven of onder een ander element ligt en vele andere aspecten kunnen in een
stylesheet worden aangegeven.
Elk aspect van de stijl wordt onafhankelijk overgeërfd door child elementen in een webpagina.
Daarom hoeven alleen de afwijkende aspecten van een stijl te worden aangegeven. Als er in de stijl
een lettertype wordt aangegeven voor het hele document, dan wordt dat lettertype in het hele
document gebruikt en hoeft het niet voor elk element apart te worden te worden aangegeven.
Niet alle aspecten van een stijl erven over. Bijvoorbeeld de breedte en hoogte van een
element erven niet over.
CSS biedt, met behulp van mediatypes, de mogelijkheid om voor verschillende webtoepassingen een
andere stijl de definiëren. Daardoor kan de stijl een webpagina worden aangepast aan weergave op
een beeldscherm of op papier.
Hoewel de CSS1 aanbeveling in 1996 werd gepubliceerd, duurde het tot 2000 voordat er een browser
beschikbaar kwam die deze specificatie volledig ondersteunde. De eerste browser die deze
ondersteuning bood was Internet Explorer 5.0 voor de Mac, andere browsers volgden echter snel.
De ondersteuning voor CSS2 van Internet Explorer is de minste van alle moderne browsers. Eén
van de bekendste problemen van Internet Explorer op dit gebied staat bekend als de Internet
Explorer box model bug. Volgens de CSS2 specificatie is de aangegeven breedte (width) van een
element een maat voor de inhoud van het element (zonder de randen mee te rekenen). Internet
Explorer interpreteert de breedte echter als externe breedte (dus met de randen meegerekend)
Handige voorbeelden.
Voorbeelden op andere pagina's van deze site
Een voorbeeld van CSS / DOM en javascript in de vorm van een tooltip control.
Creatief foto's weergeven op uw internet site.
Voorbeelden op het web
Css Zen garden, een geweldige demonstratie van hetgeen men visueel kan bereiken met CSS
Naslagwerken en handleidingen.
|