Kaskadni listovi stilova imaju mnogo prednosti. Omogućuju vam upotrebu istog stilskog lista na cijelom web mjestu. Postoje dva načina za to:
- povezivanje s elementom LINK
- uvoz pomoću naredbe @import
Prednosti i nedostaci vanjskih tabela
Jedna od najboljih stvari o kaskadni listovi stilova jest da ih možete koristiti za održavanje dosljednosti web mjesta. To ćete najlakše učiniti povezivanjem ili uvozom vanjskog lista stilova. Ako za svaku stranicu svojeg web mjesta upotrebljavate isti vanjski stil, možete biti sigurni da će sve stranice imati isto stilova.
Neke od prednosti korištenja vanjskih listova stilova uključuju mogućnost nadzora nad izgledom i izgledom nekoliko dokumenata odjednom. To je posebno korisno ako radite s timom ljudi na izradi vaše web stranice. Mnoga stilska pravila može biti teško zapamtiti, a iako možete imati tiskani vodič za stil, zamorno ih je imati da ga neprestano prelistavate kako biste utvrdili hoće li tekst teksta biti napisan fontom Arial s 12 točaka ili 14 točaka Kurir.
Možete stvoriti klase stilova koji se zatim mogu koristiti na mnogo različitih HTML elemenata. Ako često koristite poseban font Wingdings za naglašavanje različitih stvari na svojoj stranici, možete koristiti Wingdings klase koju ste postavili u svom listu stilova da biste ih stvorili, umjesto da definirate određeni stil za svaku instancu naglasak.
Svoje stilove možete jednostavno grupirati kako bi bili učinkovitiji. Sve metode grupiranja koje su dostupne CSS-u mogu se koristiti u vanjskim tablicama stilova, a to vam omogućuje veću kontrolu i fleksibilnost na vašim stranicama.
Međutim, postoje i vrlo dobri razlozi da se ne koriste vanjski stilski listovi. Kao prvo, mogu povećati vrijeme preuzimanja ako se povežete s puno njih.
Svaki put kada stvorite novu CSS datoteku i povežete je ili uvezete u svoj dokument, to zahtijeva da web preglednik uputi novi poziv web serveru kako bi je preuzeo. A pozivi poslužitelja usporavaju učitavanje stranice.
Ako imate samo mali broj stilova, oni mogu povećati složenost vaše stranice. Budući da se stilovi ne vide točno u HTML-u, svatko tko gleda stranicu mora dobiti drugi dokument (CSS datoteku) kako bi shvatio što se događa.
Kako stvoriti vanjsku tablicu stilova
Vanjski listovi stilova pišu se na isti način kao i ugrađeni i umetnuti listovi stilova. Ali sve što trebate napisati je stil selektor i deklaracija. Ne trebaju vam element ili atribut STYLE u dokumentu.
Kao i kod svih ostalih CSS, sintaksa pravila je:
selektor {svojstvo: vrijednost; }
Ta su pravila zapisana u tekstualnu datoteku s nastavkom.
.css. Na primjer, možete imenovati svoj stil tablice.
stilovi.css.
Povezivanje CSS dokumenata
Da biste povezali tablicu stilova, koristite element LINK. To ima atribute rel i href. Atribut rel govori pregledniku što povezujete (u ovom slučaju tabelu stilova), a atribut href drži put do CSS datoteke.
Postoji i neobavezna vrsta atributa pomoću koje možete definirati MIME vrstu povezanog dokumenta. To nije potrebno u HTML5, ali bi se trebalo koristiti u dokumentima HTML 4.
Evo koda koji biste koristili za povezivanje CSS lista stilova koji se naziva styles.css:
A u dokumentu HTML 4 napisali biste:
type = "tekst / css">
Uvoz CSS tablica stilova
Uvezeni stilski listovi smještaju se u element STYLE. Tada možete koristiti i ugrađene stilove ako želite. Uvezane stilove također možete uključiti u povezane tabele stilova. Unutar STYLE ili CSS dokumenta napišite:
@import url (' http://www.yoursite.com/styles.css');