Fordelene med Cascading Style Sheets

Fordelene og ulempene ved å bruke CSS på nettsider

Cascading stilark har mange fordeler. De lar deg bruke samme stilark på hele nettstedet ditt. Det er to måter å gjøre dette på:





  • kobling med LINK-elementet
|_+_|
  • importerer med @import-kommandoen
|_+_|

Fordeler og ulemper med eksterne stilark

En av de beste tingene med cascading stilark er at du kan bruke dem til å holde nettstedet ditt konsistent. Den enkleste måten å gjøre dette på er å koble til eller importere et eksternt stilark. Hvis du bruker det samme eksterne stilark for hver side på nettstedet ditt, kan du være sikker på at alle sidene vil ha det samme stiler .

Noen av fordelene med å bruke eksterne stilark inkluderer at du kan kontrollere utseendet og følelsen til flere dokumenter samtidig. Dette er spesielt nyttig hvis du jobber med et team av mennesker for å lage nettstedet ditt. Mange stilregler kan være vanskelige å huske, og selv om du kanskje har en trykt stilguide, er det kjedelig å måtte bla gjennom den hele tiden for å finne ut om eksempeltekst skal skrives med 12-punkts Arial-font eller 14-punkts Courier.



Du kan lage stilklasser som deretter kan brukes på mange forskjellige HTML-elementer. Hvis du ofte bruker en spesiell Wingdings-font for å legge vekt på ulike ting på siden din, kan du bruke Wingdings-klassen du har satt opp i stilarket for å lage dem i stedet for å definere en spesifikk stil for hver forekomst av vektleggingen.

Du kan enkelt gruppere stilene dine for å være mer effektive. Alle grupperingsmetodene som er tilgjengelige for CSS kan brukes i eksterne stilark, og dette gir deg mer kontroll og fleksibilitet på sidene dine.



Når det er sagt, er det også veldig gode grunner til å ikke bruke eksterne stilark. For det første kan de øke nedlastingstiden hvis du linker til mange av dem.

Hver gang du oppretter en ny CSS-fil og lenker eller importerer den til dokumentet ditt, krever det at nettleseren foretar et nytt anrop til webserveren for å hente filen. Og serveranrop reduserer sideinnlastingstiden.

Hvis du bare har et lite antall stiler, kan de øke kompleksiteten til siden din. Fordi stilene ikke er synlige rett i HTML-en, må alle som ser på siden få et annet dokument (CSS-filen) for å finne ut hva som skjer.

Hvordan lage et eksternt stilark

Eksterne stilark skrives på samme måte som innebygde og innebygde stilark. Men alt du trenger å skrive er stilen velger og erklæring . Du trenger ikke et STYLE-element eller -attributt i dokumentet.



Som med alle andre CSS , er syntaksen for en regel:

|_+_|

Disse reglene er skrevet til en tekstfil med filtypen



|_+_|. Du kan for eksempel navngi stilarket ditt |_+_|

Koble til CSS-dokumenter

For å koble til et stilark bruker du LINK-elementet. Denne har attributtene rel og href. rel-attributtet forteller nettleseren hva du kobler til (i dette tilfellet et stilark) og href-attributtet inneholder banen til CSS-filen.

Det er også en valgfri attributttype som du kan bruke til å definere MIME-typen til det koblede dokumentet. Dette er ikke påkrevd i HTML5, men bør brukes i HTML 4-dokumenter.



Her er koden du vil bruke for å koble til et CSS-stilark kalt styles.css:

|_+_|

Og i et HTML 4-dokument ville du skrive:



|_+_|

Importere CSS-stilark

Importerte stilark plasseres i STYLE-elementet. Du kan da også bruke innebygde stiler hvis du vil. Du kan også inkludere importerte stiler i koblede stilark. Skriv inn i STYLE- eller CSS-dokumentet:

|_+_|