Izibonelelo zokusebenzisa i-Scalable Vector Graphics
I-Valable Vector Graphics, okanye i-SVG, ibamba indima ebalulekileyo kwi-design website. Ukuba awusebenzisi okwangoku i-SVG kumsebenzi wakho wokuyila wewebhu, nasi ezinye zezizathu zokuba ufanele uqale ukwenza njalo, kunye nokusilela ongayisebenzisa kubaphequluli abadala abangayixhasi le fayile.
Isigqibo
Inzuzo enkulu yeSVG isisombululo sokuzimela. Ngenxa yokuba iifayile ze-SVG zingumfanekiso we-vector kunokuba imifanekiso ye-raster esekelwe kwi-pixel, ingahlaziywa ngaphandle kokulahlekelwa naluphi na umgangatho womfanekiso. Oku kunceda xa udala iiwebhusayithi eziphendulayo ezifuna ukubukeka kakuhle kwaye zisebenze kakuhle kwiinkalo ezahlukeneyo zeeskrini kunye nezixhobo .
Iifayile ze-SVG zingaphakanyiswa okanye zisezantsi ukuze zikwazi ukufaka ubungakanani besayizi kunye neemfuno zesakhiwo kwiwebhusayithi yakho esabelayo kwaye akudingeki ukhathazeke malunga nezo mifanekiso eziye zaphazamiseka kumgangatho nawuphi na umendo wendlela.
Uluhlu lwefayile
Enye yemingeni ngokusebenzisa imifanekiso ye-raster (JPG, PNG, GIF) kwiwebhusayithi eziphendulayo yayizikhulu zefayile yalezo mifanekiso. Ngenxa yokuba imifanekiso ye-raster ayinakulinganisa indlela eyenziwa yivolisi, kufuneka uhambise imifanekiso yakho esekelwe kwi-pixel ngobukhulu obukhulu apho baya kuboniswa khona. Oku kungenxa yokuba unako ukwenza umfanekiso omncinci kwaye ulondoloze umgangatho walo, kodwa okufanayo akunjalo ukuba wenze imifanekiso emikhulu. Isiphumo sokuphela kukuba udla imifanekiso ephakamileyo kunokuba iboniswa kwiskrini somntu, oko kuthetha ukuba banyanzelekile ukuba bafune ukukhuphela ifayile enkulu kakhulu.
I-SVG idibana nale ngxaki. Ngenxa yokuba iifayile ze vector zinyamalale, unokuba neefayile ezincinci kakhulu kunoba zinkulu kangakanani ezo mifanekiso zingadinga ukuboniswa. Oku kuza kuba nefuthe elihle kwintsebenzo jikelele yesayithi kunye nokukhutshwa kwejubane.
CSS Styling
I-SVG ikhowudi inokudibaniswa ngqo kwi-HTML yekhasi. Oku kwaziwa ngokuba "i-SVG egciniweyo." Enye yeenzuzo zokusebenzisa i-SVG enqamlezileyo kukuba ekubeni imifanekiso igxothwa ngumkhangeli-mgca ngokusekelwe kwikhowudi yakho, akukho mfuneko yokwenza isicelo se-HTTP ukuba ulandele ifayile yesithombe. Enye inzuzo kukuba i-SVG enezantsi ingafakwa ngeCSS.
Ngaba ufuna ukutshintsha umbala we icon yeSVG? Endaweni yokufuna ukuvula loo mfanekiso kwindlela ethile yokwenza isofthiwe yokuhlela kunye nokuthumela ngaphandle kwaye ulayishe kwakhona ifayile, ungatshintsha iifayile zeSVG ngeendlela ezimbalwa zeCSS.
Ungasebenzisa nezinye iindlela ze-CSS kwiimifanekiso ze-SVG ukuziguqula kwiindawo zokuhamba okanye ezinye iimfuno zokuyila. Unokwenza udibanise loo mizobo yokongeza intshukumo kunye nokusebenzisana kwiphepha.
U popopayi
Ngenxa yokuba iifayile ze-SVG zisezantsi zingabhalwe ngeCSS, ungasebenzisa ii-CSS iziboniso kubo. I-CSS iguqula kwaye utshintsho ziindlela ezimbini ezilula zokongeza ubomi kwiifayile ze-SVG. Unokufumana amava afana ne-Flash-like on page ngaphandle kokunciphisa ukuhlaselwa okuza kunye nokusebenzisa i-Flash kwiwebhusayithi namhlanje.
Ukusetyenziswa kweSVG
Njengoko unamandla njengeSVG, le mizobo ayikwazi ukutshintsha yonke imifanekiso ifomathi oyisebenzisayo kwiwebhusayithi yakho. Iifoto ezifuna ukujula kombala obunzulu ziya ku funeka zibe yiJPG okanye mhlawumbi iFayile yefayile, kodwa imifanekiso elula njengeempawu zifaneleke ngokufanelekileyo ukuba zenziwe njengeSVG.
I-SVG ingaba nefanelekileyo kwimifanekiso eyinkimbinkimbi, njengemigqa yeenkampani okanye iirafu kunye namashadi. Yonke imifanekiso iza kuxhamla ekubeni ihlaziywe, iyakwazi ukubizwa ngeCSS, kunye nezinye iindleko ezichazwe kweli nqaku.
Inkxaso yabaPhupheli abadala
Inkxaso yangoku ye-SVG ilungile kakhulu kwiibhenqa zanamhlanje. Iiphequluli kuphela ezingenazo inkxaso kule mizobo zinguqulelo ze-Internet Explorer (i-I-8 kunye nezantsi) kunye neenguqulelo ezimbalwa ze-Android. Kukho konke, ipesenti encinci yoluntu olukhungululayo sisasebenzisa ezi zikhupheli, kwaye loo nombolo iyaqhubeka iyancipha. Oku kuthetha ukuba i-SVG ingasetyenziselwa ngokukhuselekileyo kwiwebhusayithi namhlanje.
Ukuba ufuna ukubonelela ukuwa kwe-SVG, ungasebenzisa isixhobo esinjengeGrumpicon kwiQela leFilament. Olu lwazi luza kuthatha iifayile zakho zeSVG kunye nokudala ukungabikho kwe-PNG kwiziphequluli ezindala.
Ehlelwe nguJeremy Girard ngomhla we-1/27/17