Šta je to CSS?

CSS (Cascading Style Sheets) je jezik koji se koristi za opisivanje izgleda Web prezentacija. Iako se najčešće primjenjuje u izradi Web strana i korisničkih interfejsa on-line aplikacija, CSS može koristiti bilo koja vrsta XML dokumenta.

CSS - Cascading Style Sheets

U početku je na sebe ovu ulogu preuzimao sam HTML. Kako su vremenom sajtovi bili sve kompleksniji, kod je postao veoma nečitljiv i komplikovan za održavanje. Tada je postalo jasno da se mora uvesti neka nova metoda koja bi riješila ovaj problem. Rešenje je došlo sredinom 90-ih godina u vidu CSS-a, tada nazvanog CHSS.

Postoji više verzija CSS-a. Svaka od njih se nadograđivala na predhodnu i pružala nove mogućnosti. Do sada su izašle verzije CSS1, CSS2, CSS3 i CSS4. Verzija CSS4 ne postoji sama po sebi, ali postoji određeni broj modula četvrtog nivoa pa se zbog toga i ona pominje kada se govori o verzijama CSS-a.

CSS kod se u najvećem broju slučajeva nalazi u posebnom dokumentu koji se potom uključuje gde je potrebno. Ovo je ujedno i najbolja metoda rada sa CSS-om. Takođe, moguće je koristiti i CSS direktno u dokumentu čiji se dizajn menja. Ovo se može uraditi u zaglavlju dokumenta, ili u tagu elementa na čiji se izgled utiče.

KORIŠĆENJE

CSS stilovi se mogu nalaziti u zasebnom (eksternom, External) fajlu sa ekstenzijom .css, ili se mogu nalaziti na samoj html/php stranici (interni). Interni stilovi mogu biti definisani u zaglavlju stranice (u okviru head taga, Embeded), ili biti u samom html elementu (Inline).

Inline CSS - Najjednostavniji i najmanje preporučljiv način za upotrebu CSS. Koristi se ako je potrebno na licu mjesta (u samom HTML-u) izmijeniti neki već postojeći CSS stil ili zadati određeni izgled bez kreiranja stila. Nije fleksibilan, jer kod eventualnog mijenjanja stila, potrebno je više vremena da se pronađe i zamijeni. Ukoliko na sajtu postoji vše stranica sa istim podešavanjem, utom više posla.

Primjer:

<p style="color: #FF0000; text-align: center; ">Ovo je neki pasus</p>

Embeded CSS - CSS definisan u zaglavlju stranice je bolji način od prethodnog, ali i dalje može da predstavlja problem pri eventualnoj izmjeni. U tom slučaju dizajner bi morao svaku stranicu "ručno" da provjeri i izmijeni stil i samim tim troši više vremena. Ovaj način koristimo ako su nam potrebni stilovi za koje smo sigurni da ćemo ih koristiti samo na toj stranici.

Primjer:

<head>
<style type='text/css'>
body,td,th {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #333333;
}
a:link {
    color: #006600;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
</style>
</head>

External CSS – Definisanje zasebnog CSS fajla je najpreporučljiviji način, jer pri eventualnoj izmjeni sadržaja CSS fajla, stil će se automatski mijenjati i za sve stranice. Stranicu možete da povežete sa .css dokumentom, tako što head tagu unesete sljedeći kod:

<head>
<link rel='stylesheet' type='text/css' href='putanja-do-css-a/stil.css' />
</head>

gdje je stil.css eksterni css fajl.

Iako se beneficije korišćenja CSS-a ne dovode u pitanje, on ima i par ograničenja. Različiti internet pretraživači interpretiraju kod na različite načine pa je neophodno koristiti različite metode kako bi se dobila doslednost izgleda.