Professional Documents
Culture Documents
01 CSS3
01 CSS3
Upoznavanje s CSS-om
Veb stranica se sastoji od markiranja ili oznaavanja (engl. markup) segmenata HTML ili XHTML koda koji opisuju znaenje sadraja na stranici i kaskadnih opisa stilova (engl. Cascading Style Sheets, skraeno CSS), koji saoptavaju itau veba kako e se taj sadraj prikazivati u itaima i drugim korisnikim agentima. CSS daje itau veba sve vrste informacija o izgledu od rasporeda elemenata do boja naslova na stranici. U ovom poglavlju, koje je organizovano drugaije od ostalih, upoznau vas sa osnovama sintakse CSS-a i pokazati kako da je primenite na veb stranicama. Ako ste ve koristili CSS, moete preskoiti ovo poglavlje i prei na konkretne primere u poglavlju 2. Ova knjiga nije udbenik nego zbirka zadataka s reenjima koja e vam pomoi da izvravate zadatke u CSS-u. Ako nemate ni osnovna znanja o HTML-u i CSS-u, preporuujem da, zajedno sa ovom knjigom, koristite i knjigu Build Your Own Website the Right Way Using HTML & CSS (SitePoint, tree izdanje) autora Iana Lloyda.1 Ukoliko ste ve koristili HTML i CSS, upotrebite ovo poglavlje kao podsetnik dok reavate zadatke iz narednih poglavlja.
http://www.sitepoint.com/books/html3/
Ovaj dokument sadri tri podebljana naslova definisana pomou oznaka (engl. tags) h1 i h2. Ukoliko se dokument ne formatira pomou CSS-a, za naslove e se koristiti interni opis stila definisan u itau veba (engl. Web browser); naslov h1 e se prikazati krupnim fontom, dok e se za naslov h2 upotrebiti manji font ali ipak krupniji od fonta u tekstu pasusa. Dokument koji koristi ove podrazumevane stilove bie itljiv, ali ne i atraktivan. Izgled navedenih elemenata moemo izmeniti pomou jednostavnih kaskadnih opisa stilova:
<!DOCTYPE html> <html lang=en> <head> <meta charset=utf-8 /> <title>A Simple Page</title> <style> h1, h2 { font-family: Times New Roman, Times, serif; color: #3366cc; } </style> </head> <body> <h1>First Title</h1> <p>A paragraph of interesting content.</p> <h2>Second Title</h2> <p>A paragraph of interesting content.</p> <h2>Third title</h2> <p>A paragraph of interesting content.</p> </body> </html>
Sva magija se odvija izmeu oznaka style u elementu head dokumenta, gde moete zadati svetloplavu boju i beserifni font, i primeniti ih na sve elemente h1 i h2 na stranici. Ne zamarajte se sintaksom, uskoro u je detaljno objasniti. Nema potrebe da ita dodajemo u HTML kd izmene u definiciji stila na vrhu stranice odrazie se na sva tri naslova, kao i na svaki naslov koji e se kasnije dodati stranici.
Umetnuti stilovi
CSS stilovi se najlake dodaju veb stranicama pomou umetnutih ili rednih stilova (engl. inline styles). Umetnuti stil se primenjuje na HTML element pomou atributa style, kao u sledeem odlomku koda:
<p style=font-family: Times New Roman, Times, serif; color: #3366cc;> Amazingly few discotheques provide jukeboxes. </p>
Upotreba umetnutih stilova ne zahteva selektore primenjuju se deklaracije stilova na nadreeni element. U gornjem primeru to je oznaka p. Umetnuti stilovi imaju ozbiljan nedostatak: ne mogu se koristiti vie puta. Na primer, da bismo prethodni stil primenili na drugi element p, morali bismo ponovo da ga upiemo u atributu style tog elementa. Ukoliko bismo kasnije taj stil eleli da izmenimo, morali bismo da pronaemo i izmenimo svaku HTML oznaku u koju je taj stil kopiran. Uz to, umetnuti stilovi se definiu zajedno s kodom stranice, to oteava itljivost i auriranje koda.
Ugraeni stilovi
Drugi nain primene CSS stilova na veb stranice jeste pomou elementa style, kao u prvom primeru koji smo razmotrili. Pomou ugraenih stilova (engl. embedded styles) moete deklarisati proizvoljan broj CSS stilova izmeu poetnih i zavrnih oznaka style na sledei nain:
<style> Ovde dolaze CSS stilovi </style>
Oznake style se postavljaju u okviru elementa head. Iako je prikladna i jednostavna, oznaka style ima jedan veliki nedostatak: da biste na veb lokaciji koristili odreeni skup stilova, morate ponoviti njihove definicije u okviru elementa style na vrhu svake stranice na veb lokaciji. Mnogo je praktinije da ove definicije postavite u obinu tekstualnu datoteku s kojom ete kasnije povezati svoje dokumente. Ovu spoljnu datoteku nazivamo spoljni opis stila (engl. external stylesheet).
Seate li se naeg prvog primera, u kome su tri naslova delila isto pravilo stila (engl. style rule)? Sauvajmo to pravilo u spoljnom opisu stila pod nazivom styles.css, i poveimo ga s veb stranicom na sledei nain:
<!DOCTYPE html> <html lang=en> <head> <meta charset=utf-8 /> <title>A Simple Page</title> <link rel=stylesheet href=styles.css /> </head> <body> <h1>First Title</h1> <p>A paragraph of interesting content.</p> <h2>Second Title</h2> <p>A paragraph of interesting content.</p> <h2>Third title</h2> <p>A paragraph of interesting content.</p> </body> </html>
Vrednost atributa rel mora biti opis stila (stylesheet). Atribut href sadri lokaciju i ime datoteke opisa stila (styles.css).
Nije va tip
esto ete videti da veza ka opisu stila izgleda kao: <link rel=stylesheet type=text/ css href=styles.css />. Ovde izostavljamo atribut type, jer koristimo HTML5 koji ga ne zahteva.
Sintaksa CSS-a | 5
Datoteku styles.css moete koristiti na svakoj stranici, ba kao i datoteke sa slikama. Zahvaljujui tome ne morate ponovo upisivati definicije stilova, a naslovi e se sigurno prikazivati ujednaeno na itavoj veb lokaciji.
Sintaksa CSS-a
Opis stila je skup definicija stilova. Svaka CSS definicija stila, ili pravilo, ima dve glavne komponente: Listu od jednog ili vie selektora razdvojenih zarezima, koja definie element ili ele mente na koje e se stil primeniti. Deklarativni blok (engl. declaration block), odvojen vitiastim zagradama {}, koji odreuje ta se datim stilom zapravo postie.
Deklarativni blok sadri jednu ili vie deklaracija stila, koje definiu vrednosti odreenog svojstva (engl. property). Deklaracije se razdvajaju takom i zarezom (;). Deklaracija svojstva se sastoji od imena svojstva i njegove vrednosti razdvojenih dvotakom (:). Ove elemente moete videti na slici 1.1. svojstvo vrednost svojstvo vrednost
selektori
deklarativni blok
Slika 1.1. Komponente CSS pravila: lista selektora i deklarativni blok.
Reenja u knjizi preteno e se oslanjati na razliita svojstva i vrednosti koje ta svojstva mogu imati. Na slici 1.1 se vidi da se pravilo stila moe napisati u jednom redu. Neki autori uvlae svako pravilo stila da bi kd bio pregledniji, a drugi ih piu u jednom redu da bi utedeli prostor. U nastavku e biti prikazana oba naina pisanja pravila stilova:
h1, h2 { font-family: Times New Roman, Times, serif; color: #3366cc; } h1, h2 { font-family: Times New Roman, Times, serif; color: #3366cc; }
Primere CSS selektora viaemo i dalje u ovoj knjizi, i zato treba to pre da se upoznate s razliitim tipovima selektora i nainima njihovog rada. U tome e vam pomoi primeri za osnovne tipove selektora, dati u nastavku.
Selektori tipa
Osnovni oblik selektora je selektor tipa (engl. type selector) s kojim smo se ve sreli. Prilikom imenovanja odreenog HTML elementa, moete primeniti pravilo stila na taj element kad god se pojavi u dokumentu. Selektori tipa esto se koriste da bi se definisali osnovni stilovi koji e se pojavljivati na veb lokaciji. Na primer, pomou narednog pravila stila moemo zadati podrazumevani font h1 za veb lokaciju:
h1 { font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size: 1.2em; color: #000000; }
Selektori klase
Dodela stilova elementima je dobra praksa, ali ta ako elite da dodelite razliite stilove identinim elementima koji se pojavljuju na razliitim mestima u dokumentu? Ovde na scenu stupaju CSS klase. Razmotrimo naredni still, koji sve naslove h2 u dokumentu boji u plavo:
h2 { color: #0000ff; }
Divota! Ali ta e se desiti ako na stranici postoji i izdvojen odeljak teksta, tj. bona traka (engl. sidebar) na plavoj pozadini? Ako bi tekst ovog odeljka takoe bio plav, ne bi se video. Potrebno je da definiete klasu za izdvojeni odeljak i da potom toj klasi dodelite CSS stil. Prvo izmenite HTML kd kako biste dodali klasu naslovu:
<h2 class=sidebar>This text will be white, as specified by the CSS style definition below.</h2>
Sintaksa CSS-a | 7
U drugom pravilu se pomou selektora klase zadaje da se stil primenjuje na sve elemente ija je vrednost klase .sidebar. Taka (.) pokazuje da imenujemo klasu, a ne HTML element. Klasu moete dodati proizvoljnom broju elemenata u dokumentu.
ID selektori
Suprotno selektorima klase, ID selektori slue za biranje odreenog elementa umesto grupe elemenata. Da biste upotrebili ID selektor, prvo pridruite atribut id elementu koji stilizujete. Vano je da ID bude jedinstven u itavom HTML dokumentu:
<p id=tagline>This paragraph is uniquely identified by the ID tagline.</p>
Ovaj element referenciramo pomou njegovog ID selektora tako to ispred atributa ID navodimo znak tarabe (#). Na primer, naredno pravilo nalae da se prethodni pasus prikae belom bojom:
#tagline { color: #ffffff; }
Kombinatori
Narednu grupu selektora koju emo obraditi ine kombinatori (engl. combinators). Kombinatori upuuju na znak koji se postavlja izmeu dva jednostavna selektora. Tako se dobija moniji selektor kojim se jo preciznije moe izdvojiti odgovarajui deo d okumenta.
Selektori potomaka
Selektor potomaka (engl. descendant selector) odgovara elementu koji je potomak zadatog elementa. U ovom selektoru se kao kombinator koristi razmak. Pretpostavimo da na veb lokaciji imate element h2 koji treba da se prikae u plavoj boji; meutim, unutar izdvojenog odeljka teksta na veb lokaciji postoje elementi h2 koje hoete da prikaete u beloj boji kako bi se videli na tamnoj pozadini. Kao to smo ranije pomenuli, mogli biste dodati klasu svim ovim naslovima, ali je mnogo jednostavnije da ih definiete pomou CSS-a. U ovakvim sluajevima koriste se selektori potomaka.
Kao to vidite, selektor potomaka se sastoji od liste selektora (razdvojenih razmacima) koja odgovara elementu stranice (ili grupi elemenata) od spolja ka unutra. U ovom sluaju, poto stranica sadri element div klase sidebar, selektor potomaka .sidebar h2 odnosi se na sve elemente h2 unutar tog elementa div. Ako koristite selektore potomaka, ne morate pristupati svom HTML kodu kako biste direktno pridruivali klase svim elementima. Moete koristiti glavne strukturne oblasti na stranici koje se identifikuju pomou klasa ili identifikatora tamo gde se to trai i elemente stilova unutar njih.
Selektori dece
Za razliku od selektora potomaka koji odgovaraju svim elementima potomcima roditeljskog elementa, ukljuujui elemente koji nisu direktni potomci selektor dece (engl. child selector) odgovara svim elementima koji su direktni potomci zadatog elementa. Uovom selektoru se kao kombinator koristi znak >. Razmotrimo naredni segment koda:
<div class=sidebar> <p>This paragraph will be displayed in white.</p> <p>So will this one.</p> <div class=tagline> <p>If we use a descendant selector, this will be white too. But if we use a child selector, it will be blue.</p> </div> </div>
U ovom primeru, selektor potomaka koji smo videli u prethodnom odeljku, .sidebar p, odgovarao bi svim pasusima ugnjeenim u element div sa klasom sidebar, kao i u one unutar elementa div sa klasom tagline. Ako elite samo da stilizujete one pasuse koji su direktni potomci elementa sidebar div, upotrebiete selektor dece. Selektor dece koristi znak > da bi zadao direktnog potomka. Evo novog selektora, kojim se u belo boji tekst onih pasusa koji su direktno u elementu sidebar div (ali ne i u elementu tagline div):
p { color: #0000FF; }
Sintaksa CSS-a | 9
Samo e prvi pasus biti obojen u belo. Drugi element p nije susedan elementu h2, pa e njegov tekst biti prikazan crnom bojom, to smo zadali u prvom pravilu za elemente p.
Selektori pseudoklasa
Selektor pseudoklasa (engl. pseudo-class selector) deluje kao da element ima klasu koja se primenjuje u skladu sa stanjem tog elementa. Selektori pseudoklasa na poetku imaju dvotaku i obino se navode iza selektora tipa elementa, bez dodatnih razmaka. Moj cilj je da vas upoznam sa sintaksom i terminologijom vezanom za ove selektore, kako biste razumeli njihovo delovanje kada ih budemo sretali u nastavku ove knjige. Zato u ovom poglavlju neu detaljno obraivati sve selektore, a kompletan spisak sa objanjenjima moete pronai na mrei (SitePoint CSS Reference).2
Selektori veza
Veina nas se prvi put sretne sa pseudoklasama tokom njihove primene na veze. Veza (engl. link) ima razliita stanja. Ona moe biti neposeena (engl. unvisited) ili poseena (engl. visited), pokazana miem (engl. hovered over) ili pritisnuta (engl. clicked). Svako stanje veze moemo definisati pomou CSS-a:
a:link { color: #0000ff; }
http://reference.sitepoint.com/css/selectorref
Prva definicija zadaje boju neposeene veze. Ako je veza poseena, primenjuje se drugo pravilo. Ukoliko je na vezu postavljen pokaziva mia, koristi se definicija :hover, a ako je pritisnuta ili aktivirana na drugi nain, definicija :active. Selektori pseudoklasa :hover i :active nazivaju se i dinamike pseudoklase (engl. dynamic pseudo-classes), jer deluju samo kad korisnik radi sa elementom. Da bi se one aktivirale, neto se mora prethodno desiti. Redosled definicija u dokumentu je vaan. Definicija a:active mora se navesti poslednja kako bi redefinisala prethodne definicije. O tome emo detaljnije govoriti u nastavku poglavlja kada budemo obraivali kaskadu.
Selektori first-child
Selektor pseudoklase first-child odnosi se na element koji predstavlja prvo dete roditeljskog elementa. I ovaj selektor ete lake savladati pomou primera. Dokument sadri skup pasusa. Oni se nalaze unutar elementa div sa klasom article. Pomou CSS-a i selektora potomaka moemo definisati da font u svim ovim pasusima bude krupniji i podebljan:
.article p { font-size: 1.5em; font-weight: bold; }
Da biste prvi pasus prikazali krupnijim i podebljanim fontom kao u uvodnim pasusima lanaka upotrebite first-child:
.article p:first-child { font-size: 1.5em; font-weight: bold; }
ita veba e primeniti CSS samo ako pasus predstavlja prvi element p unutar elementa sa klasom article. Zato je selektor pseudoklase prvog deteta koristan kada hoete da ulepate tekst (na primer, da prvi pasus nekog teksta ili prva pojava naslova budu malo drugaiji od ostatka).
Sintaksa CSS-a | 11
Selektori last-child
Kao to smo pomou selektora first-child adresirali prvu instancu nekog elementa u kontejneru, pomou selektora last-child odrediemo poslednju instancu elementa. Sledi CSS koji postavlja ivicu ispod svake stavke u listi:
.navigation li { border-bottom: 1px solid #999999; }
Selektori nth-child
Selektor pseudoklase nth-child bira vie elemenata, zavisno od njihove pozicije u stablu dokumenta. Sledi jednostavan primer u kome emo segmentirati redove kako bi tabela postala preglednija. Naredna CSS deklaracija dodeljuje boju pozadine samo eliji u neparnom redu tabele:
tr:nth-child(odd) td { background-color: #f0e9c5; }
Osim kljunih rei za parne (engl. even) i neparne (engl. odd) brojeve, moete upotrebiti i izraz s mnoiocem:
tr:nth-child(2n+1) td { background-color: #f0e9c5; }
U nastavku knjige detaljnije emo govoriti o selektoru nth-child i objasniti kako se mnoioci mogu koristiti za biranje odgovarajuih delova tabele s podacima.
Selektori only-child
Selektor pseudoklase only-child bira element samo ako je on jedino dete roditeljskog elementa. Na primer, pretpostavimo da u HTML kodu postoje dve liste koje stoje jedna iza druge, i da prva sadri dve stavke a druga jednu:
<ul> <li>Item one</li> <li>Item two</li> <li>Item three</li> </ul> <ul> <li>A single item list not really a list at all!</li> </ul>
Naredna CSS deklaracija referisae samo stavku druge liste jer je element li jedino dete roditeljskog elementa ul:
li:only-child { list-style-type: none; }
Selektori pseudoelemenata
Pseudoelementi (engl. pseudo-elements) deluju kao da ste umetnuli nov segment HTML koda na stranicu a zatim ga stilizovali. Pseudoelementi se u CSS3 specifikaciji oznaavaju duplom dvotakom, na primer, p::first-letter. Kada je re o pseudoelementima koji su postojali u CSS2 (na primer, ::first-letter, ::first-line, ::before i ::after), od proizvoaa itaa veba se trai da odravaju podrku za sintaksu s jednom dvotakom koju su ovi selektori ranije koristili. Ako koristite prethodne selektore, u vreme pisanja ove knjige jedna dvotaka trebalo bi da je dobila bolju podrku itaa veba pa savetujem da je primenjujete. Izuzetak je ::selection, koja je dodata u CSS3 specifikaciji.
Selektori first-letter
Selektor pseudoelementa first-letter deluje kao da ste prvo slovo sadraja unutar roditeljskog elementa postavili izmeu oznaka span a zatim ga stilizovali. Na primer, ako smo u kodu koristili oznaku span, on moe izgledati ovako:
<div class=wrapper> <p><span class=firstletter>T</span>his is some text within a div with a class of wrapper.</p> </div>
Moemo i ukloniti span iz koda i na isti nain izabrati prvo slovo pomou selektora pseudoelementa prvog slova:
.wrapper:first-letter { font-size: 200%; font-weight: bold; }
Selektori first-line
Isto kao to selektor prvog slova bira prvo slovo unutar kontejnera, selektor first-line bira prvi red:
.wrapper:first-line { font-size: 200%; font-weight: bold; }
Sintaksa CSS-a | 13
Selektor first-line ima mnogo vie mogunosti od postavljanja prvog reda teksta izmeu oznaka span i stilizovanja. Kada sadraj stavljate u oznake span, ne moete znati da li e se duina prvog reda promeniti (na primer, zbog korisniki podeene veliine teksta ili izmena koje e u tekstu praviti sistem za odravanje sadraja). Selektor pseudoklasa first-line uvek e formatirati prvi red teksta onako kako se prikazuje u itau veba.
Pseudoelement before
Pseudoelement before se koristi zajedno sa svojstvom content da bi se definisalo mesto prikazivanja generisanog sadraja. Generisani sadraj (engl. generated content) jeste sadraj koji se u dokumentu vizuelizuje iz CSS-a. Ovo moe biti korisno iz vie razloga, i o tome emo govoriti u nastavku knjige. Za sada emo prikazati HTML kd za jednostavan primer:
<div class=article> <p>Hello World!</p> </div>
A CSS kd je:
.article:before { content: Start here; }
Ovo e u itau veba ispisati Start here unutar elementa div koji se otvara, odnosno, pre prvog elementa p.
Pseudoelement after
Pseudoelement after radi na isti nain kao i before, ali on vizuelizuje sadraj na kraju roditeljskog elementa, tj. pre elementa div koji se zatvara u naem prethodnom primeru HTML koda:
.article:after { content: End here; }
Ako se upotrebi isti kd kao i u prethodnom primeru za pseudoelement before, prethodni CSS e kao rezultat dati tekst End here pre elementa div koji se zatvara, i nakon zatvaranja oznake p.
Selektori atributa
Selektori atributa (engl. attribute selectors) omoguavaju da izaberete element na osnovu atributa. Primer atributa HTML elementa nai emo ako pogledamo element a koji pravi vezu. Atributi naredne veze su href i title:
<a href=http://google.com title=Visit Google>Google</a>
Pomou selektora atributa moemo proveriti vrednost atributa i prikazati CSS koji se zasniva na njoj. Jednostavan primer za to je polje form input; ono ima atribut type koji objanjava o kojoj vrsti polja je re. Valjane vrednosti za atribut type jesu text, radio
ic heckbox. Ako pokuamo da stilizujemo checkbox na isti nain kao polje text input, dobiemo vrlo udan rezultat pa moemo primeniti selektor atributa da bismo napravili definiciju samo za polja input s tipom text. Na primer, uzmimo polje form:
<input type=text name=name id=fName />
Na primer, ako ste koristili svojstvo verzije CSS3 koje se naknadno promenilo, veb lokacija napravljena pre godinu dana mogla bi odjednom poprimiti udan izgled u novom i unapreenom itau veba. Da bi se izbegao ovaj problem, proizvoai itaa u ranim fazama implementacije esto koriste prefiks prozvoaa kako bi napravili specifinu implementaciju. Na primer, da bismo napravili zaobljene uglove, koristimo svojstvo border-radius na sledei nain:
border-radius: 10px;
Meutim, da bi zaobljeni uglovi mogli da se primene u starijim verzijama itaa Firefox i Safari, treba da umetnete prefikse proizvoaa:
-webkit-border-radius: 10px; moz-border-radius: 10px; border-radius: 10px;
Kada modul dospe u fazu u kojoj se verovatno vie nee menjati, itai veba poinju da podravaju stvarno svojstvo uporedo sa sopstvenim. Neki itai nemaju posebne verzije proizvoaa i primenjuju samo verziju iz specifikacije. U ovoj knjizi ete nai brojne primere ovakvih svojstava s prefiksom i nauiete da ih koristite.
http://reference.sitepoint.com/css/importantdeclarations
autorskim opisima stilova uvek e redefinisati stilove u podrazumevanim opisima stilova itaa. Jedino mogue drugo poreklo za opise stilova jesu korisniki opisi stilova namenski stilovi koje su pisali korisnici itaa veba a ak i njih redefiniu autorski opisi stilova (osim u posebnim sluajevima). Ako elite da saznate vie o ovoj temi, posetite poseban odeljak na lokaciji SitePoint CSS Reference. Dva dela kaskade koja e najvie uticati na va svakodnevni rad sa CSS-om jesu specifinost i redosled primene. Pravilo specifinosti (engl. specificity) omoguava da pravilo stila sa selektorom najvieg nivoa specifinosti redefinie ostale selektore s niim nivoima specifinosti. Da bismo ovaj problem ilustrovali primerom, razmotrite jednostavan odlomak HTML koda:
<div id=content> <p class=message> This is an important message. </p> </div>
Sva etiri selektora odgovaraju elementu pasusa u primeru HTML-a i zadaju boju teksta. Koja e se boja primeniti na pasus? Ako je va odgovor #FF0000 ili crvena, u pravu ste. Tip selektora p (svaki element p) ima najnii nivo specifinosti, a sledi .message (svaki element s klasom message). Se lektor p.message (svaki element p s klasom message) nakon toga ima vii nivo specifinosti. Najvii je selektor #content p.message (svaki element p sa klasom message koji predstavlja dete elementa sa sadrajem id). Dui selektori nemaju nuno vii nivo specifinosti. Selektor ID e, na primer, uvek imati viu specifinost od elemente type ili klase selector. to su selektori sloeniji, stvar postaje zapetljanija ali se nadam da e primeri u ovoj knjizi biti dovoljno jednostavni za razumevanje. Ako hoete da znate tanu formulu za merenje specifinosti, posetite veb lokaciju SitePoint CSS Reference, koja sadri odgovore na sva vaa pitanja.4 Ako se dva ili vie stilova i dalje mogu primeniti na neki element, upotrebie se pravilo redosleda primene (engl. source order). Primenjuje se poslednje pravilo koje se deklarie. Ovo vai i u sluajevima kada deklariete vie pravila stilova jednim selektorom (na primer, .message u vaem opisu stilova). Ovo e biti druga pojava pravila koje e se primeniti na element. Kao to emo videti u narednim poglavljima, ova osobina je vrlo korisna.
http://reference.sitepoint.com/css/specificity
Pravi izbor | 17
Pravi izbor
Ovo poglavlje je trebalo da vas uvede u svet CSS-a i njegovu primenu na osnovnom nivou. Pozabavili smo se ak i konceptom kaskade, koji ponekad moe delovati zbunjujue. Ako nemate iskustvo u radu sa CSS-om ali razumete pojmove o kojima se govorilo u ovom poglavlju, verovatno ete bez veih problema koristiti primere iz ove knjige. Primeri u prvim poglavljima su jednostavniji od onih u kasnijim poglavljima. Zavisno od nivoa znanja CSS-a, reavajte ih onim redom koji vam odgovara. Nadam se da ete uivati u radu sa CSS-om.