Handleiding HTML - @-regels

CSS		@-regels

Handleiding HTML Inhoud CSS | Inhoud HTML | Trefwoordenregister | Begin

Inhoud onderdeel: Introductie @-regels | @import | @media | @page

Introductie @-regels

@-regels zijn speciale constructies die opgenomen worden een stijlblok in de head van een document of in een extern stijlblad. Ze bieden mogelijkheden die met gewone stijlregels niet bereikt kunnen worden.

Een @-regel begint met een @-sleutelwoord, dat bestaat uit de combinatie van het @-karakter en een woord waarmee de regel geïdentificeerd kan worden. CSS 2.1 kent een drietal @-sleutelwoorden: @import, @media en @page. De in CSS 2 opgenomen sleutelwoorden @font-face en @charset zijn wegens gebrek aan ondersteuning uit de huidige specificatie geschrapt, maar zullen in latere versies zeker weer terugkomen.

De @import-regel maakt het mogelijk een extern stijlblad te importeren in een stijlblok of in een ander extern stijlblad. Een @import-regel bevat in ieder geval een verwijzing naar het externe stijlblad en wordt afgesloten met een puntkomma. Bijvoorbeeld:

@import url("stijl/basis.css");

De @media-regel maakt het mogelijk binnen één stijlblok of stijlblad stijlen op te nemen, die betrekking hebben op de weergave door verschillende soorten apparaten. Een @media-regel bevat een lijst met één of meer door komma's gescheiden media typen en verder een blok met één of meer stijlregels, dat wordt begrensd door accolades (gekrulde haken). Bijvoorbeeld:

@media print { H1, H2, H3 { color: #336699; background-color: #FFFFFF; } }

De @page-regel maakt het mogelijk stijlen te definiëren voor de pagina-opmaak bij het afdrukken. Een @page-regel bevat een blok met één of meer stijldeclaraties, dat wordt begrensd door accolades (gekrulde haken). Bijvoorbeeld:

@page { margin: 12%; }

Een stijlblok of stijlblad mag meerdere @import-, @media- en @page-regels bevatten en daarnaast ook gewone stijlregels. Een @import-regel mag niet in een @media-regel opgenomen worden en moet altijd vóór de andere regels geplaatst worden. Wanneer niet aan deze voorwaarden voldaan wordt, moet de browser de @import-regel negeren.

@import- en @media-regels worden door vrijwel alle gangbare browsers ondersteund. De ondersteuning voor de @page-regel is op dit moment echter minimaal. Een browser die een @-regel niet ondersteund, moet deze negeren.

Gedetailleerde informatie over de ondersteuning door de belangrijkste browsers is bij de beschrijving van de afzonderlijke @-regels in een tabel opgenomen. Eventuele bijzonderheden met betrekking door de ondersteuning zijn onder de tabel vermeld. Een verklaring van de gebruikte afkortingen in de tabel is te vinden in de legenda bij de beschrijving van de eigenschappen.

Vervolg: @import

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