Operation Manual

127
Laatst bijgewerkt 2/5/2011
Hoofdstuk 6: Pagina's maken met CSS
Wat zijn CSS-stijlpagina's (Cascading Style Sheets)
Informatie over CSS (Cascading Style Sheets)
Cascading Style Sheets (CSS) bestaan uit een verzameling opmaakregels die het uiterlijk van de inhoud op een
webpagina bepalen. Bij het gebruik van CSS-stijlen voor de opmaak (indeling) van een pagina scheidt men de inhoud
van de presentatie ervan. De inhoud van uw pagina—de HTML-code—bevindt zich in het HTML-bestand, terwijl de
CSS-regels die de presentatie van de code bepalen, zich in een ander bestand (een externe stijlpagina) of in een ander
deel van het HTML-document (doorgaans de kopsectie) bevinden. Door de inhoud te scheiden van de presentatie
wordt het veel gemakkelijker om het uiterlijk van uw site te onderhouden vanaf een centrale locatie, omdat u telkens
wanneer u een wijziging aanbrengt, nu niet elke eigenschap op elke pagina hoeft bij te werken. Het scheiden van de
inhoud van de presentatie leidt ook tot meer eenvoudige en schonere HTML-code, hetgeen weer leidt tot kortere
laadtijden in de browser en een vereenvoudigde navigatie voor mensen met toegankelijkheidsproblemen (bijvoorbeeld
bezoekers die schermlezers gebruiken).
CSS biedt een grote mate van flexibiliteit in en controle over het precieze uiterlijk van uw pagina. Met CSS hebt u
controle over een groot aantal teksteigenschappen, waaronder specifieke lettertypen en tekengroottes, vet, cursief,
onderstreept en tekstschaduwen, tekstkleur en achtergrondkleur, de kleur en onderstreping van koppelingen, en nog
veel meer. Bij gebruik van CSS voor de controle van uw lettertypen kunt u ook zorgen voor een meer consistente
afhandeling van uw pagina-indeling en het uiterlijk in meerdere browsers.
Naast tekstopmaak kunt u CSS ook gebruiken voor de controle over de opmaak en wijze van positioneren van
elementen op blokniveau in een webpagina. Een element op blokniveau is een zelfstandig stuk inhoud dat in HTML
doorgaans wordt gescheiden door een nieuwe regel en visueel wordt opgemaakt als een blok. Zo leidt het gebruik van
de labels voor
h1, p en div in alle gevallen tot elementen op blokniveau op een webpagina. Voor elementen op
blokniveau kunt u marges en randen instellen, terwijl u ze op een specifieke locatie kunt positioneren, ze van een
achtergrondkleur kunt voorzien, de tekst erin kunt laten zweven, enzovoort. Het manipuleren van elementen op
blokniveau bestaat in wezen uit de manier waarop u uw pagina's opmaakt met CSS.
Ga naar www.adobe.com/go/vid0152_nl voor een zelfstudie over Cascading Style Sheets.
Meer Help-onderwerpen
“Werken met labels voor div-tags” op pagina 163
“Pagina's met CSS opmaken” op pagina 156
Inzicht in CSS-zelfstudie
Informatie over CSS-regels
Een CSS-opmaakregel bestaat uit twee delen—de kiezer en de declaratie (of, in de meeste gevallen, een blok
declaraties). De kiezer is een term (zoals
p, h1,een klassenaam of een id) waarmee het opgemaakte element wordt
aangeduid, terwijl het declaratieblok bepaalt wat de stijleigenschappen zijn. In het volgende voorbeeld is
h1 de kiezer,
terwijl alles wat tussen de accolades (
{}) staat, het declaratieblok is: