Naissoost veebidisainer töötab oma arvutis kaasaegses kontoris
Pildi krediit: monkeybusinessimages/iStock/Getty Images
Algne Cascading Style Sheets spetsifikatsioon ja selle palju uuem CSS3 versioon on tehnoloogiad, mida kasutatakse HTML-veebilehtede täiustamiseks ja vormindamiseks. CSS oli algselt loodud veebilehe esitluskihi haldamiseks tõhusamalt kui vormindamine HTML-iga, mis ei olnud kunagi mõeldud kaasaegse veebi keeruka ehituse käsitlemiseks. Kuna CSS2 on CSS1 üldkasutatav laiendus, tähendab termin CSS ilma numbrita CSS2 kaasamist. CSS3 spetsifikatsioon on 2014. aasta juuli seisuga veel väljatöötamisel, seega peavad veebiarendajad arvestama, et funktsioonide tugi on brauseriteti erinev.
CSS3 on tagasiühilduv CSS-iga
CSS3 on CSS2 värskendus, mis säilitab ühilduvuse kõigi CSS-i funktsioonidega – CSS3 ei kaota ühtegi CSS-koodi. CSS3 kood on loodud veebilehtede paremaks väljanägemiseks ja kiiremaks laadimiseks ning kasutaja brauseris lehtede koostamiseks kuluva arendusaja vähendamiseks. CSS3 muudab veebidisaini lehekujunduselementide jaoks vähem sõltuvaks pildifailidest ning vähendab failide edastamise taotlusi ja allalaadimisaega, kasutades vähem pilte. CSS1 keskendus välimuse vormindamisele, samas kui CSS2 lisas teksti ja objektide positsioneerimisvõimalused. Vanemad brauseri versioonid, nagu IE 9 ja varasemad, ei toeta laialdaselt CSS3 lisatud funktsioone, mis võivad nõuda täiendavat arendusaega, et säilitada CSS-i varukoodi.
Päeva video
CSS3 lisab ümarad nurgad ja kalded
Enne CSS3 pidid veebiarendajad kujundama pildifailid, et lisada struktuursete ääriste jaoks ümardatud nurki ja taustapiltide gradiente; CSS3 sisaldab võrreldavaid funktsioone, mida saab lisada mõne koodireaga. CSS-is peab veebiarendaja kujundama äärise või gradiendi, laadima selle pildiserverisse, asetama pildi lehele ja kasutama CSS-i, et ääris õigesti positsioneerida. CSS3-s saab veebiarendaja midagi sarnast saavutada koodiga, näiteks ".roundBorder{border-radius: 10px;}". Taustagradiendid on veidi keerulisemad ja nõuavad erinevate brauserite jaoks erinevat koodi. Näiteks valgest mustani gradient Chrome'i ja IE jaoks kasutab sellist koodi nagu ".gradBG{background: liner-gradient (white, black);}".
CSS3 lisab animatsioonifunktsioone ja tekstiefekte
CSS3-l on käputäis funktsioone, mida CSS-is pole, et parandada teie lehe elementide välimust. CSS3 abil saavad veebiarendajad lisada tekstile tekstivarju, et hõlbustada lugemist või lisada visuaalset elegantsi, ja sundida pikemates sõnades reavahetusi, et need mahuksid reamurdmisega veergudesse. Enne CSS3 pidid veebiarendajad kodeerima animatsiooni sellistes skriptikeeltes nagu JavaScript ja jQuery; CSS3 lisab kujunduskihile mitmeid animatsioonifunktsioone. W3C töötab endiselt veebianimatsioonistandardi kallal, et lahendada erinevate animatsioonitehnikate ühilduvusprobleeme.
CSS3 määratleb tekstiveerud
CSS3 lisab võimaluse jagada tekstiosad mitmeks veerguks, et neid lugeda nagu ajalehte. CSS2 spetsifikatsioonis on veebiarendajatel keeruline koostada mitmeveerulisi tekstiosasid, kuna standard pole varustatud teksti automaatseks poolitamiseks. Eriti saitide puhul, millel on tundlik disain, arendustehnika, mis korraldab sisu ümber ja muudab selle suurust vastavalt seadme ekraani eraldusvõimet vaadates võib suurema monitoriga inimestel olla keeruline lugeda tekstiridasid, mis laialivalguvad ekraan.
