Diferențele dintre CSS și CSS3

Femeie care lucrează la birou într-un birou de creație ocupat

O femeie web designer la lucru pe computerul ei într-un birou modern

Credit imagine: monkeybusinessimages/iStock/Getty Images

Specificația originală Cascading Style Sheets, precum și revizuirea sa mult mai recentă CSS3, sunt tehnologii folosite pentru a îmbunătăți și formata paginile Web HTML. CSS a fost conceput inițial pentru a gestiona stratul de prezentare al unei pagini Web într-un mod mai eficient decât formatarea cu HTML, care nu a fost niciodată menită să se ocupe de construcția complexă a web-ului contemporan. Deoarece CSS2 este o extensie universal adoptată a CSS1, termenul CSS fără număr implică includerea CSS2. Specificația CSS3 este încă în curs de dezvoltare din iulie 2014, așa că dezvoltatorii web trebuie să ia în considerare că suportul pentru funcții variază între browsere.

CSS3 este compatibil cu CSS

CSS3 este o actualizare a CSS2 care menține compatibilitatea cu toate caracteristicile CSS -- CSS3 nu depreciază niciun cod CSS. Codul CSS3 este conceput pentru a face paginile Web să arate mai bine și să se încarce mai rapid, precum și pentru a reduce timpul de dezvoltare pentru a construi pagini în browserul unui utilizator. CSS3 face ca designul web să fie mai puțin dependent de fișierele de imagine pentru elementele de design ale paginii și reduce cererile de transfer de fișiere și timpul de descărcare prin utilizarea mai puține imagini. CSS1 sa concentrat pe formatarea aspectului, în timp ce CSS2 a adăugat capabilități de poziționare pentru text și obiecte. Versiunile mai vechi de browser, cum ar fi IE 9 și anterioare, nu acceptă pe scară largă funcțiile adăugate CSS3, care pot necesita timp suplimentar de dezvoltare pentru a menține codul alternativ CSS.

Videoclipul zilei

CSS3 adaugă colțuri rotunjite și degrade

Înainte de CSS3, dezvoltatorii web trebuiau să proiecteze fișiere de imagine pentru a adăuga lucruri precum colțuri rotunjite pentru marginile structurale și gradienții de imagine de fundal; CSS3 include caracteristici comparabile care pot fi adăugate cu câteva linii de cod. În CSS, un dezvoltator Web trebuie să proiecteze un chenar sau un gradient, să îl încarce pe serverul de imagini, să plaseze imaginea pe pagină și să folosească CSS pentru a poziționa corect chenarul. În CSS3, dezvoltatorul Web poate realiza ceva similar cu cod precum „.roundBorder{border-radius: 10px;}”. Gradienții de fundal sunt puțin mai complicati și necesită cod diferit pentru diferite browsere. De exemplu, un gradient de la alb la negru pentru Chrome și IE utilizează cod precum „.gradBG{background: liner-gradient (alb, negru);}”.

CSS3 adaugă funcții de animație și efecte de text

CSS3 are o mână de funcții care nu sunt prezente în CSS pentru a îmbunătăți aspectul elementelor paginii dvs. Cu CSS3, dezvoltatorii web pot adăuga o umbră text textului pentru a face mai ușor de citit sau pentru a adăuga fler vizual și pot forța întreruperile de linie în cuvinte mai lungi pentru a le face să se potrivească în coloanele cu încadrare de cuvinte. Înainte de CSS3, dezvoltatorii web trebuiau să codifice animația în limbaje de scripting precum JavaScript și jQuery; CSS3 adaugă mai multe caracteristici de animație la stratul de design. W3C încă lucrează la un standard de animații web pentru a rezolva problemele de compatibilitate între diferitele tehnici de animație.

CSS3 definește coloanele de text

CSS3 adaugă capacitatea de a împărți secțiunile de text în mai multe coloane pentru a le citi ca un ziar. În specificația CSS2, dezvoltatorilor web le este dificil să construiască secțiuni de text cu mai multe coloane, deoarece standardul nu este echipat pentru a împărți automat textul. În special cu site-urile care prezintă un design responsive, o tehnică de dezvoltare care rearanjează și redimensionează conținutul pe baza Vizualizarea rezoluției ecranului dispozitivului, persoanele cu monitoare mai mari pot avea dificultăți în citirea rândurilor de text care se întind pe ecran.