Uvod u CSS
CSS je tehnologija za formatiranje web stranica. Na ovom mestu započinjemo seriju lekcija o CSS-u, u kojima ćemo vam objasniti različite mogućnosti za podešavanje izgleda HTML dokumenata. Naša ideja je da tekstovi budu kratki, konkretni i jednostavni. Ovaj CSS tutorijal je namenjen potpunim početnicima, i kreće od CSS osnova, ali verujemo da će i iskusni web dizajneri/developeri moći da ga koriste kao referencu. Ako ste početnik, savetujemo da se takođe upoznate i sa osnovama HTML-a, pošto su ove dve teme neodvojive. Verujemo da i najkomplikovanije teme mogu jednostavno da se objasne, posebno ako se ilustruju sa što više primera.
Pojam CSS-a
Kao što smo rekli na početku, CSS (Cascade Style Sheets) predstavlja web tehnologiju za formatiranje HTML/XML dokumenata. Kao što već znamo, HTML služi za opis sadržaja dokumenta. Ako želimo da "podesimo" kako će izgledati bilo koji elemenat na našoj stranici, koristimo CSS.
Nemojte da vas zbunjuje sledeća stvar: neki HTML elementi imaju već unapred definisan izgled (npr. naslovi su prikazani većim fontom, pasusi imaju razmak između, linkovi su prikazani plavom bojom i podvučeni...), ali nikada ne treba koristiti HTML oznake u svrhu određivanja izgleda teksta.
Osnovni elementi CSS-a
CSS pravila za formatiranje zadaju se u obliku deklaracije koji ima sledeći oblik:
atribut : vrednost
Atributi su unapred definisane ključne reči, gde svaka ima svoje značenje i odnosi se na neki aspekt izgleda dokumenta. U prevodu:
- atribut - šta želimo da podesimo
- vrednost - na koju vrednost ga podešavamo
Tako pomoću CSS atributa možemo podešavati boje, fontove, margine, okvire... Možemo tačno i precizno odrediti gde će se prikazivati elementi, kontrolisati pozadinu svakog elementa, dodavati specijalne efekte.
Svaki atribut, po standardu, može imati jednu ili više vrednosti. Kakve će ove vrenosti biti, zavisiće od samog atributa. Za neke su moguće merne vrednosti (npr. 100 piksela ili 20mm), za neke samo unapred definisane ključne reči (na primer, font može biti bold ili normal), negde se zadaju kolorne vrednosti, a negde nešto sasvim drugačije.
CSS deklaracije
Na primer, za podešavanje boje teksta koristimo atribut color. Ovaj atribut ima samo tu jednu svrhu, odnosno može se koristiti isključivo za postavljanje boje slova unutar nekog HTML elementa.
Atribut color, kao vrednost može imati neku boju. Boje se mogu zadati na različite načine, a jedan od najjednostavnijih je korišćenjem unapred definisanih naziva. Tako bismo za plavu boju teksta mogli da navedemo vrednost blue. Više o ovome pročitajte u odeljku Boje.
Ovakav iskaz bi onda imao oblik color: blue, što bi označavalo plavu boju teksta.
color: blue