Iilayibrari ezingama-23 ezikumgangatho ophezulu kuyilo lwewebhu

CSS

Iilayibrari zangoku zeCSS bubungqina benqanaba eliphezulu loyilo lwewebhu kwaye zenze njani izinto zibe lula xa kufikwa ekuphumezeni ezo ndlela zibalaseleyo zokuqonda ukuba yintoni amava ewebhu.

Kungenxa yoko le nto siza kuthi Yabelana ngeelayibrari ezingama-23 ezikumgangatho ophezulu Amagcisa ohlukeneyo abonisa ukuba yonke into inokwenzeka njani ngolu lwimi loyilo. Unikezelo olunomdla lwezixhobo zokumangalisa kwinto enokufezekiswa nge-CSS.

Imenyu ye-Blur

I-Blur

Omnye idemo ebalaseleyo apho unokufumana khona imizekelo esixhenxe. Basebenzisa utshintsho lweCSS3 kwaye ingaba yintoni ingqiqo enkulu ekusebenziseni abakhethiweyo abahlukeneyo ukudala umphumo ophezulu wokufiphaza.

Amafu eCSS3D

Amafu

Nge kuphela hover ngaphezulu kwale demo, Uya kuba nakho ukufumana isiphumo esiphumeleleyo ngeli thala leencwadi leCSS. Eyona nto ibaluleke kakhulu, loo mafu ahamba ngokupheleleyo. Isebenzisa i-CSS3 3D Transforms kunye neJavaScript. Ukusuka kwikhonkco ungafikelela kwisifundo apho unokufumana khona inyathelo ngalinye.

Iimpawu kwiCSS emsulwa

ILogos

Eli thala leencwadi liqulathe ezinye zeelogo ezaziwa kakhulu ngazo zonke izinto ezinje ngeApple okanye iTwitter. Kuyinto enomdla ngakumbi ukuba unokwazi iipropathi zelogo nganye ngokubeka isikhombisi semouse. Unako konke ukufikelela kwikhowudi epheleleyo kwikhonkco.

Ibha yokuhamba nguJan Kadera

Jan

Ukusuka codepen.io esinayo ukufikelela kule bar yokuhamba kwi-3D ehamba ngokumangalisayo kwaye apho sinokuyazi ngokupheleleyo ikhowudi yayo. Into eyodwa ngeli thala lencwadi kukuba inemigca engama-65 kuphela. Iimpawu ezintsha zeCSS3 zikhona kubunzulu bentsimi.

Iiphaneli zemifanekiso ezibalekayo

Slide

Unokufikelela kwisifundo ukusuka apha. Ixabiso layo elikhulu ngu agudileyo oopopayi xa ushenxisa iiphaneli zemifanekiso. Ungafikelela kwiiyantlukwano ezine ukuzibandakanya kwiwebhusayithi yakho kwaye ufezekise iziphumo ezintle.

Iringi emibini

Iringi ebini

Singaphambili isangqa esenziwe ngokutsha ngokugqibeleleyo ngoopopayi abakhulu bokuvelisa. Ukusuka kwi-codepen.io unokufikelela kuyo yonke ikhowudi eyenziwe ngamakhulu emigca.

I-Flexbox

lukwazi

Iibhokisi zeFlexbox yindlela entsha yeCSS yokubonisa iikholamu kwiphepha. A Isikhokelo esibanzi ukuqonda ezi zikhongozeli.

Imenyu yokuhamba enemibala

U kuhamba

Unokufikelela kwi yonke i-HTML kunye ne-CSS kule menyu yokuhamba ozibiza ukuba uthanda uthando ngombala. Yenziwe ngokupheleleyo kwi-CSS ukuze ukwazi ukuntywilisela kolu lwimi.

Inkqubela phambili yeebar kwi-CSS3

Iibha

Nangona ikwisiNgesi, njengakwiivenkile ezininzi zeencwadi, I-HTML kunye ne-CSS zichazwe kakuhle iyafuneka ukuba ibe nemivalo yenkqubela phambili yoyilo. Iigradients, imigca kunye nezinye iintlobo zezinto ezibonakalayo zilindelwe kuwe.

I-animate.css

I-Animate

Idume kwiGitHub, yiyo yenziwe ngokupheleleyo kwi-CSS. Khetha oopopayi ofuna ukuyazi, kwaye kufuneka ucofe nje kwiqhosha "Animate it" ukubona isiphumo kwiAnimate.css. Ungayikhuphela okanye uyibuke kwiGitHub.

spinkit

spinkit

Sijongene nengqokelela yezalathi ezinokuthi sebenzela zonke iintlobo zezinto ezibonakalayo kwiwebhu. Cofa ku "Umthombo" kwaye uya kufumana yonke ikhowudi eyimfuneko yokuphunyezwa kwayo.

Amaqhosha

Amaqhosha

Omnye Ithala leencwadi leCSS Kuzo zonke iindlela kunye nemibono yokufumana enye oyifunayo ukuzehlula kukhuphiswano. Ukusuka kwibar esecaleni ungazicima iimilo okanye iziphumo ongafuniyo ukuzifumana kwaye ke ugxile kwenye ngokukodwa.

FlipSwitch

I-Flipswitch

Singaphambili usetyenziso olukuvumela ukuba ukhubaze amaqhosha athile ukwenza enye kanye le nto siyifunayo. Sisebenzisa useto olwahlukileyo kwaye ekugqibeleni sinokuvelisa ikhowudi esiya kuyikopa kwiwebhusayithi yethu. Izixhobo ezinomdla kakhulu ekusebenzeni kwayo kunye nesitayile esihle.

Icebo.css

Amacebo

Omnye Ithala leencwadi leCSS ngaphandle kweJavaScript kwaye ikulungele ukuba usebenzise njengoko unqwenela. Incinci ngobukhulu, kulula ukuyisebenzisa kwaye isebenza kuzo zonke izikhangeli zewebhu zangoku.

Imibala.css

Imibala

Kulowo u jonga umbala kwenye indlela enomdla kwaye ivumela ukukhuphela ngokukhawuleza kwiiwebhusayithi ezinembonakalo enkulu.

Zintso.css

IiVoxels

Ukuba uyazi iMinecraft, umdlalo wolwakhiwo, ngokuqinisekileyo eli thala leencwadi leCSS kulula ukuliqonda. Jikelezisa njengoko sicinezela embindini ukuya kuvelisa iigridi.

Uhlobo lokuchwetheza

typography

Omnye ifonti emsulwa yeCSS ayisindi ilula ngokugqibeleleyo kwiprojekthi yakho elandelayo.

Abajikelezi

Abajikelezi

Omnye ingqokelela enkulu yoopopayi yokulayisha ii icon kwiCSS nakwi-HTML.

Izalathisi zomgca wokuhlawula

Izikhombisi

Isicatshulwa esinyulu kwisibini seCSSukulayisha izalathi zazo zonke iintlobo. Umthombo omkhulu wokufumana isikhombisi esifanelekileyo nesifanelekileyo kwiwebhusayithi yakho.

Umlayishi weCSS

Umlayishi weCSS

Okunye ifonti yokulayisha ii icon ezinokuthi zilungiselelwe zonke iintlobo zoopopayi.

Hover yomfanekiso

Hover

Omnye Ithala leencwadi leCSS elinokutsha kunye nobunzima obuncinci bemifanekiso yelo klasi «hover».

hue.css

Ukuthotywa isidima

Umthombo we Ama-gradients angama-49 okanye iigradients yefotoreti Zonke iintlobo zomxholo kunye nemifanekiso.

Izinto eziphathekayo

imathiriyeli

Un Isakhelo seCSS esekwe kuYilo lweZinto, umgaqo woyilo osetyenziswe nguGoogle kwinani elikhulu leapps kunye nakwinkqubo yayo yokusebenza ye-Android.

Ungaphoswa kukuqeshwa ngewebhu ezigqityiweyo nge Imifanekiso ye-svg.


Yiba ngowokuqala ukuphawula

Shiya uluvo lwakho

Idilesi yakho ye email aziyi kupapashwa. ezidingekayo ziphawulwe *

*

*

  1. Uxanduva lwedatha: UMiguel Ángel Gatón
  2. Injongo yedatha: Ulawulo lwe-SPAM, ulawulo lwezimvo.
  3. Umthetho: Imvume yakho
  4. Unxibelelwano lwedatha: Idatha ayizukuhanjiswa kubantu besithathu ngaphandle koxanduva lomthetho.
  5. Ukugcinwa kweenkcukacha
  6. Amalungelo: Ngalo naliphi na ixesha unganciphisa, uphinde uphinde ucime ulwazi lwakho.