Kaskaderende stilark har mange fordele. De giver dig mulighed for at bruge det samme typografiark på hele dit websted. Der er to måder at gøre dette på:
- linker til LINK-elementet
- importerer med kommandoen @import
Fordele og ulemper ved eksterne stilark
En af de bedste ting ved kaskade stilark er, at du kan bruge dem til at holde dit websted konsekvent. Den nemmeste måde at gøre dette på er at linke eller importere et eksternt stilark. Hvis du bruger det samme eksterne stilark for hver side på dit websted, kan du være sikker på, at alle siderne har det samme stilarter.
Nogle af fordelene ved at bruge eksterne stilark inkluderer, at du kan kontrollere udseendet og følelsen af flere dokumenter på én gang. Dette er især nyttigt, hvis du arbejder med et team af mennesker for at oprette dit websted. Mange stilregler kan være vanskelige at huske, og selvom du måske har en trykt stilvejledning, er det kedeligt at have til konstant at bladre gennem det for at afgøre, om eksemplet skal skrives i 12-punkts Arial-skrifttype eller 14-punkts Kurer.
Du kan oprette klasser af stilarter, som derefter kan bruges på mange forskellige HTML-elementer. Hvis du ofte bruger en speciel Wingdings-skrifttype til at lægge vægt på forskellige ting på din side, kan du bruge Wingdings klasse, du har oprettet i dit typografiark for at oprette dem i stedet for at definere en bestemt stil for hver forekomst af vægt.
Du kan nemt gruppere dine stilarter for at være mere effektive. Alle de grupperingsmetoder, der er tilgængelige for CSS, kan bruges i eksterne stilark, og dette giver dig mere kontrol og fleksibilitet på dine sider.
Når det er sagt, er der også meget gode grunde til ikke at bruge eksterne stilark. For det første kan de øge downloadtiden, hvis du linker til mange af dem.
Hver gang du opretter en ny CSS-fil og linker eller importerer den til dit dokument, kræver det, at webbrowseren foretager et nyt opkald til webserveren for at hente filen. Og serveropkald nedsætter sidens indlæsningstid.
Hvis du kun har et lille antal stilarter, kan de øge kompleksiteten af din side. Fordi typografierne ikke er synlige lige i HTML-koden, skal enhver, der kigger på siden, få et andet dokument (CSS-filen) til at finde ud af, hvad der foregår.
Sådan oprettes et eksternt stilark
Eksterne typografiark skrives på samme måde som indlejrede og integrerede stilark. Men alt hvad du behøver for at skrive er stilen vælger og erklæring. Du har ikke brug for et STYLE-element eller en attribut i dokumentet.
Som med alle andre CSS, syntaksen for en regel er:
vælger {egenskab: værdi; }
Disse regler er skrevet til en tekstfil med filtypenavnet.
.css. For eksempel kan du navngive dit stilark.
styles.css.
Sammenkædning af CSS-dokumenter
For at linke et stilark bruger du LINK-elementet. Dette har attributterne rel og href. Rel-attributten fortæller browseren, hvad du linker (i dette tilfælde et typografiark), og href-attributten holder stien til CSS-filen.
Der er også en valgfri attributtype, som du kan bruge til at definere MIME-typen for det linkede dokument. Dette er ikke påkrævet i HTML5, men skal bruges i HTML 4-dokumenter.
Her er den kode, du vil bruge til at linke et CSS-stilark kaldet styles.css:
Og i et HTML 4-dokument ville du skrive:
type = "tekst / css">
Import af CSS Style Sheets
Importerede typografiark placeres inden for STYLE-elementet. Du kan derefter også bruge indlejrede stilarter, hvis du vil. Du kan også inkludere importerede stilarter inde i sammenkædede typografiark. Inde i STYLE- eller CSS-dokumentet skal du skrive:
@import url (' http://www.yoursite.com/styles.css');