Kada web preglednik učita web stranicu, način na koji se pojavljuje određen je podacima iz kaskadnog stila. Postoje tri načina da HTML datoteka koristi stilski list: vanjski, interno i in-line.
Interni i in-line stilski listovi pohranjeni su unutar same HTML datoteke. Jednostavno je za rad u ovom trenutku, ali zato što nisu pohranjeni na središnjem mjestu, nemoguće je jednostavno izmijeniti stil na cijeloj web stranici odjednom; morat ćete se vratiti u svaki unos i promijeniti ga ručno.
No, s vanjskim stilskim stranicama, upute za prikazivanje stranice pohranjene su u jednoj datoteci, što ga čini vrlo jednostavnim za uređivanje stylinga preko cijele web stranice ili više elemenata. Datoteka koristi ekstenziju .CSS datoteke, a veza na lokaciju te datoteke uključena je u HTML dokument tako da web preglednik zna gdje potražiti upute za oblikovanje.
Jedan ili više dokumenata može se povezati na istu CSS datoteku, a web stranica može imati mnoge jedinstvene CSS datoteke za oblikovanje različitih stranica, tablica, slika itd.
Kako se povezati s vanjskim stilskim listom
Svaka web stranica koja želi koristiti određeni vanjski stilski list treba povezati s CSS datotekom unutar
odjeljak, ovako:
U ovom primjeru, jedina stvar koju treba mijenjati kako bi bila primjenjiva na vaš dokument jest styles.css tekst. Ovo je mjesto vaše CSS datoteke.
Ako se datoteka zove styles.css i nalazi se u istoj mapi kao i dokument koji se povezuje s njom, može ostati upravo onako kako je gore navedeno. Međutim, šanse su da je vaša CSS datoteka naslovljena nešto drugo, u kojem slučaju možete jednostavno promijeniti naziv iz "stilova" na ono što je tvoje.
Ako CSS datoteka nije u korijenu ove mape, ali umjesto toga u podmapi, ona bi mogla čitati nešto slično ovome:
Više informacija o vanjskim CSS datotekama
Najveća korist vanjskih stilova jest da nisu vezana za određenu stranicu. Ako se styling izvodi interno ili in-line, druge stranice na web stranici ne mogu ukazivati na one postavke stylinga.
S vanjskim stilom, međutim, ista se CSS datoteka može upotrijebiti za doslovno svaku pojedinu stranicu na web stranici tako da svi imaju jedinstven izgled, a uređivanje cjelokupnog CSS sadržaja web stranice je vrlo jednostavno i centralizirano.
Možete vidjeti kako to funkcionira u nastavku …
Unutarnji stil zahtijeva korištenje
Međutim, budući da su vanjski stilski listovi sadržani u vlastitoj datoteci, oni se mogu stvoriti ovako i to znači točno ista stvar kao i gornji uzorak:
tijelo {background-color: green; } h1 {boja: plava; margina-lijevo: 15px; }
U tim primjerima inline styling se odnosi samo na tu stranicu, što je očigledno činjenicom da se nalazi u pojedinostima zaglavlja HTML stranice. U drugom primjeru, CSS informacije sadrže se u CSS datoteci koju svaka stranica može povezati s upotrebom koda iz Kako se povezati s vanjskim stilskim listom odjeljak gore.