Razlike između CSS-a i CSS3

Žena radi za stolom u zauzetom kreativnom uredu

Ženska web dizajnerica radi na svom računalu u modernom uredu

Zasluga slike: monkeybusinessimages/iStock/Getty Images

Izvorna specifikacija Cascading Style Sheets, kao i njezina mnogo novija CSS3 revizija, tehnologije su koje se koriste za poboljšanje i formatiranje HTML web stranica. CSS je u početku bio dizajniran za učinkovitije rukovanje slojem prezentacije web stranice od formatiranje s HTML-om, koji nikada nije bio namijenjen rješavanju složene konstrukcije suvremenog weba. Budući da je CSS2 univerzalno prihvaćeno proširenje CSS1, izraz CSS bez broja podrazumijeva uključivanje CSS2. Specifikacija CSS3 je još uvijek u razvoju od srpnja 2014., tako da web programeri moraju uzeti u obzir da podrška značajkama varira između preglednika.

CSS3 je unatrag kompatibilan s CSS-om

CSS3 je ažuriranje za CSS2 koje održava kompatibilnost sa svim CSS-ovim značajkama -- CSS3 ne odbija nijedan od CSS koda. CSS3 kod je dizajniran kako bi web stranice izgledale bolje i brže se učitavale, kao i smanjilo vrijeme razvoja za izradu stranica u korisničkom pregledniku. CSS3 čini web dizajn manje oslanjajući se na slikovne datoteke za elemente dizajna stranice i smanjuje zahtjeve za prijenos datoteka i vrijeme preuzimanja korištenjem manjeg broja slika. CSS1 se fokusirao na oblikovanje izgleda, dok je CSS2 dodao mogućnosti pozicioniranja teksta i objekata. Starije verzije preglednika kao što je IE 9 i ranije ne podržavaju široko dodane značajke CSS3, što može zahtijevati dodatno vrijeme razvoja za održavanje CSS zamjenskog koda.

Video dana

CSS3 dodaje zaobljene kutove i gradijente

Prije CSS3, web programeri morali su dizajnirati slikovne datoteke kako bi dodali stvari kao što su zaobljeni kutovi za strukturne granice i gradijente pozadinske slike; CSS3 uključuje usporedive značajke koje se mogu dodati s nekoliko redaka koda. U CSS-u, web programer mora dizajnirati obrub ili gradijent, prenijeti ga na poslužitelj slika, postaviti sliku na stranicu i koristiti CSS za ispravan položaj obruba. U CSS3, web programer može postići nešto slično s kodom poput ".roundBorder{border-radius: 10px;}". Pozadinski gradijenti su malo kompliciraniji i zahtijevaju drugačiji kod za različite preglednike. Na primjer, gradijent od bijele do crne za Chrome i IE koristi kod kao što je ".gradBG{pozadina: liner-gradient (bijelo, crno);}".

CSS3 dodaje značajke animacije i tekstualne efekte

CSS3 ima pregršt značajki koje nisu prisutne u CSS-u za poboljšanje izgleda elemenata vaše stranice. Uz CSS3, web programeri mogu dodati tekstualnu sjenu tekstu kako bi ga olakšali čitanje ili dodali vizualni štih i mogu prisiliti prijelome reda unutar dužih riječi kako bi se uklopili u stupce s prelamanjem riječi. Prije CSS3, web programeri su morali kodirati animaciju u skriptnim jezicima kao što su JavaScript i jQuery; CSS3 dodaje nekoliko značajki animacije sloju dizajna. W3C još uvijek radi na standardu web animacije kako bi riješio probleme kompatibilnosti između različitih tehnika animacije.

CSS3 definira tekstualne stupce

CSS3 dodaje mogućnost podjele tekstualnih odjeljaka u više stupaca kako bi se čitali kao novine. U specifikaciji CSS2, web programeri teško mogu konstruirati tekstualne odjeljke s više stupaca jer standard nije opremljen za automatsko dijeljenje teksta. Osobito na web-lokacijama koje imaju responzivni dizajn, razvojnu tehniku ​​koja preuređuje i mijenja veličinu sadržaja na temelju gledajući razlučivost zaslona uređaja, ljudi s većim monitorima mogu imati poteškoća s čitanjem redaka teksta koji se protežu po cijeloj zaslon.