Šta je CSS i gde se koristi?

Šta su Cascading Style Sheets?

Web lokacije se sastoje od više pojedinačnih delova, uključujući slike, tekst i različite dokumente. Ovi dokumenti ne uključuju samo one sa kojima se može povezati sa različitih stranica, kao što su PDF datoteke, već i dokumenti koji se koriste za konstrukciju samih stranica, kao što su HTML dokumenti za određivanje strukture stranice i CSS (Cascading Style Sheet) dokumenata da diktira izgled stranice. Ovaj članak će se upuštati u CSS, pokrivajući ono što je i gdje se danas koristi na web stranicama.

CSS historijska lekcija

CSS je prvi put razvijen 1997. godine kao način za web programera da definišu vizuelni izgled web stranica koje su kreirali. Bilo je namijenjeno da omogući web profesionalcima da odvoje sadržaj i strukturu kodova web stranice iz vizuelnog dizajna, nešto što do sada nije bilo moguće.

Razdvajanje strukture i stila dozvoljava HTML-u da izvrši više funkcije od kojih je prvobitno bio zasnovan - oznaku sadržaja, bez potrebe da brinu o dizajnu i izgledu same stranice, nešto poznato pod nazivom "look and feel" stranice.

CSS nije postao popularan sve do 2000. godine, kada su web pretraživači počeli da koriste više od osnovnih fontova i aspekata boje ovog markerskog jezika. Danas svi savremeni preglednici podržavaju CSS nivo 1, većinu CSS nivoa 2, pa čak i većinu aspekata CSS nivoa 3. Kako CSS nastavlja da se razvija i uvedu nove stilove, veb pregledači su počeli da implementiraju module koji donose novu CSS podršku u te pregledače i daju web dizajnerima moćne nove alatke za stajanje sa kojima će raditi.

U (mnogim) prethodnim godinama bilo je odabranih web dizajnera koji su odbili da koriste CSS za dizajn i razvoj web stranica, ali ta praksa je danas sve više od industrije. CSS je sada široko korišćeni standard u web dizajnu i biće vam teško da pronađete bilo koga koji radi u industriji danas, koji nije imao barem osnovno razumevanje ovog jezika.

CSS je skraćenica

Kao što je već pomenuto, termin CSS označava "Cascading Style Sheet." Razbijamo ovu rečenicu malo da bismo u potpunosti objasnili šta ovi dokumenti rade.

Reč "stilski list" odnosi se na sam dokument (poput HTML-a, CSS datoteke su zapravo samo tekstualni dokumenti koji se mogu uređivati ​​različitim programima). Stil listovi se koriste za dizajn dokumenata već dugi niz godina. To su tehničke specifikacije za izgled, bilo da se štampa ili online. Dizajneri štampe već dugo koriste stilske listove kako bi osigurali da su njihovi dizajnirani štampani tačno prema njihovim specifikacijama. Stajalište za web stranicu služi istoj svrsi, ali uz dodatnu funkcionalnost takođe govori web pretraživaču kako prikazati dokument koji se gleda. Danas CSS stilski listovi takođe mogu da koriste medijske upite kako bi promenili način na koji stranice traže različite uređaje i veličine ekrana . Ovo je neverovatno važno, jer omogućava da jedan HTML dokument bude drugačije prikazan prema ekranu koji se koristi za pristup njemu.

Kaskada je zaista poseban deo izraza "kaskadni stilski list". Web stilski stil je namijenjen kaskadi kroz niz stilova u tom listu, kao rijeka preko vodopada. Voda u reci udari sve stene u vodopadu, ali samo oni na dnu utiču na tačno gde će voda proći. Isto važi i za kaskadu u listovima stilova veb sajta.

Svakoj web stranici utječe najmanje jedan stilski stil, čak i ako web dizajner ne primjenjuje nikakve stilove. Ovaj stilski stil je stilski stil liste korisnika - takođe poznat kao podrazumevani stilovi koje će web pretraživač koristiti za prikazivanje stranice ako se ne daju druge instrukcije. Na primjer, podrazumevano su hiperveze stilizirane plavom bojom i podvučene su. Ti stilovi dolaze iz defaultnog stila lista web pretraživača. Međutim, ako web dizajner obezbedi druga uputstva, pretraživač će morati znati koja uputstva imaju prednost. Svi pregledači imaju svoje defaultne stilove, ali mnoge od tih podrazumeva (kao plave podvučene tekstualne veze) dele se u svim ili većim glavnim pregledačima i verzijama.

Za još jedan primer podrazumevanog pretraživača, u mom veb pregledaču, podrazumevani font je " Times New Roman " prikazan na veličini 16. Skoro nijedna od stranica koje posećujem nije prikazana u toj porodici i veličini fontova, međutim. To je zato što kaskada definiše da su drugi stilovi stila koji sami postavljaju dizajneri da redefinišu veličinu fonta i porodicu, prevazilazeći podrazumevane vrednosti svog web pretraživača. Svi stilski listovi koje kreirate za web stranicu će imati više specifičnosti nego standardni stil pretraživača, tako da će se ta podrazumevana vrijednost primjenjivati ​​samo ako vam stilski stil ne prevaziđe. Ako želite da veze budu plave i podvučene, ne morate ništa uraditi pošto je to podrazumevano, ali ako CSS datoteka vaše stranice kaže da veze moraju biti zelene, ta boja će prevazići podrazumevano plavo. Podvlačenje će ostati u ovom primeru, pošto niste naveli drugačije.

Gdje je CSS korišten?

CSS se takođe može koristiti za definisanje načina na koji web stranice treba gledati kada se gledaju na drugim medijima nego web pregledač. Na primer, možete kreirati list stila za štampanje koji će definisati kako web stranicu treba ispisati. Pošto stavke web stranice kao što su navigacioni tasteri ili web obrasci neće imati svrhu na odštampanoj stranici, štampani list lista se može koristiti da "isključi" ta područja kada se strana odštampa. Iako nije uobičajena praksa na mnogim sajtovima, opcija za kreiranje listova stila ispisa je moćna i atraktivna (po mom iskustvu - većina web profesionalaca to ne radi jednostavno jer obim budžeta sajta ne zahtijeva da se ovaj dodatni posao obavi ).

Zašto je važan CSS?

CSS je jedan od najsnažnijih alata koje web dizajner može naučiti jer s njim možete uticati na čitav vizuelni izgled web stranice. Dobro napisani listovi stilova mogu se brzo ažurirati i dozvoliti sajtovima da promijene ono što je vizuelno određeno na ekranu, što zauzvrat pokazuje vrijednost i fokusira se na posjetioce, bez ikakvih promjena koje bi trebale biti napravljene na osnovnom HTML oznaku.

Glavni izazov CSS-a je u tome što postoji prilično malo učenja - a sa pretraživačima koji se mijenjaju svaki dan, ono što dobro radi danas možda neće imati sjajan smisao s obzirom da će novi stilovi biti podržani, a drugi pasti ili izostaviti uslugu iz jednog ili drugog razloga .

Zbog toga što CSS može kaskirati i kombinirajući, a uzimajući u obzir kako različiti pregledači mogu drugačije tumačiti i implementirati direktive, CSS može biti teži od običnog HTML-a za master. CSS se takođe menja u pretraživačima na način koji HTML stvarno ne čini. Jednom kada počnete da koristite CSS, videćete da će iskorištavanje snage stilskih listova pružiti neverovatnu fleksibilnost u tome kako ćete postaviti web stranice i definirati njihov izgled i osećaj. U tom pravcu ćete nabaviti "vreću trikova" stilova i pristupa koji su u prošlosti radili za vas i koji možete ponovo da se uključite dok budete gradili nove web stranice u budućnosti.

Originalni članak Jennifer Krynin. Ispravio / la Jeremy Girard dana 7/5/17,