Cascading Style Sheets: verschil tussen versies
(Interwiki) |
(Uitbreiding) |
||
Regel 1: | Regel 1: | ||
'''Cascading Style Sheets''' (vaak afgekort tot '''CSS''') is een hulpmiddel om [[webpagina]]'s op een centrale manier [[vormgeving]] te geven. In plaats van door gebruik te maken van style-[[attribuut|attributen]] ([[HTML]]) op de webpagina wordt er gebruik gemaakt van [[stylesheet]]s om webpagina's vorm te geven. Er zijn twee manieren om CSS op een webpagina te gebruiken; door middel van een ''inline stylesheet'' (de CSS wordt in de [[broncode]] van de webpagina zelf geplaatst) of door middel van een ''stylesheet'' (aparte pagina met de [[Bestandsextensie|extensie]] CSS). Bij de laatste manier wordt de webpagina aan de ''stylesheet'' gekoppeld, zodat de webpagina weet welke CSS hij moet gebruiken. |
'''Cascading Style Sheets''' (vaak afgekort tot '''CSS''') is een hulpmiddel om [[webpagina]]'s op een centrale manier [[vormgeving]] te geven. In plaats van door gebruik te maken van style-[[attribuut|attributen]] ([[HTML]]) op de webpagina wordt er gebruik gemaakt van [[stylesheet]]s om webpagina's vorm te geven. Er zijn twee manieren om CSS op een webpagina te gebruiken; door middel van een ''inline stylesheet'' (de CSS wordt in de [[broncode]] van de webpagina zelf geplaatst) of door middel van een ''stylesheet'' (aparte pagina met de [[Bestandsextensie|extensie]] CSS). Bij de laatste manier wordt de webpagina aan de ''stylesheet'' gekoppeld, zodat de webpagina weet welke CSS hij moet gebruiken. |
||
+ | |||
+ | == Code == |
||
+ | CSS ziet er bijvoorbeeld zo uit: |
||
+ | <pre> |
||
+ | header,h1{ |
||
+ | font-size: 12pt; |
||
+ | text-align: center; |
||
+ | background-color: red; |
||
+ | } |
||
+ | h1{ |
||
+ | color:orange; |
||
+ | } |
||
+ | </pre> |
||
+ | Hierbij wordt voor header en h1 (bovenste deel van een pagina en een titel van niveau 1) de lettertypegrootte op 12 punten ingesteld. De tekst wordt gecentreerd en de achtergrond wordt rood voor header en h1. |
||
+ | |||
+ | Voor h1 alleen wordt de kleur oranje ingesteld. Voor kleuren worden Engelse namen gebruikt. Een alternatief is het gebruiken van een website om een kleurcode te kiezen, zie bijvoorbeeld [http://colorhexa.com colorhexa.com] |
||
+ | |||
+ | Voorbeeld: |
||
+ | |||
+ | <pre> |
||
+ | h1{ |
||
+ | color:#87d735; /* Dit is groen */ |
||
+ | } |
||
+ | </pre> |
||
+ | De commentaar staat tussen /* en */. |
||
+ | |||
{{beg}} |
{{beg}} |
||
+ | |||
[[Categorie:Internet]] |
[[Categorie:Internet]] |
||
+ | |||
[[fr:Feuilles de style en cascade]] |
[[fr:Feuilles de style en cascade]] |
||
[[en:Cascading Style Sheets]] |
[[en:Cascading Style Sheets]] |
Versie van 16 aug 2014 11:16
Cascading Style Sheets (vaak afgekort tot CSS) is een hulpmiddel om webpagina's op een centrale manier vormgeving te geven. In plaats van door gebruik te maken van style-attributen (HTML) op de webpagina wordt er gebruik gemaakt van stylesheets om webpagina's vorm te geven. Er zijn twee manieren om CSS op een webpagina te gebruiken; door middel van een inline stylesheet (de CSS wordt in de broncode van de webpagina zelf geplaatst) of door middel van een stylesheet (aparte pagina met de extensie CSS). Bij de laatste manier wordt de webpagina aan de stylesheet gekoppeld, zodat de webpagina weet welke CSS hij moet gebruiken.
Code
CSS ziet er bijvoorbeeld zo uit:
header,h1{ font-size: 12pt; text-align: center; background-color: red; } h1{ color:orange; }
Hierbij wordt voor header en h1 (bovenste deel van een pagina en een titel van niveau 1) de lettertypegrootte op 12 punten ingesteld. De tekst wordt gecentreerd en de achtergrond wordt rood voor header en h1.
Voor h1 alleen wordt de kleur oranje ingesteld. Voor kleuren worden Engelse namen gebruikt. Een alternatief is het gebruiken van een website om een kleurcode te kiezen, zie bijvoorbeeld colorhexa.com
Voorbeeld:
h1{ color:#87d735; /* Dit is groen */ }
De commentaar staat tussen /* en */.
Dit artikel is een beginnetje. Je wordt uitgenodigd op bewerk te klikken om dit artikel aan te vullen.
Meer informatie over dit onderwerp vind je hier: |
Dit artikel is een beginnetje.
|