Izixhobo ezikwi-Intanethi ziphantse zangapheliyo, kodwa ukuzifumana komgangatho yeyona nto inzimaNangona ukhangela kancinci kwaye unoluhlu olufanelekileyo lwewebhusayithi ezinikezelwe kuyilo, izinto ziba lula. Ngexesha apho iilwimi ezinje nge-HTML kunye ne-CSS zikwixesha elimnandi, ukusondela simahla, izibonelelo ezikumgangatho ophezulu ziphantse zonqakraza kude.
Siza kudwelisa uthotho lwe amakhadi asimahla kwi-HTML nakwi-CSS Ezifanele zonke iintlobo zeblogi, ishishini, i-e-commerce nokunye okuninzi. Ingqokelela yexesha elide ukuze ibandakanywe komnye wemisebenzi oyenzayo kuzo zonke iintlobo zabaxumi. Masenze ngolu luhlu olusebenzisa codepen.io ukuze ufumane ikhowudi kuzo zombini i-HTML kunye ne-CSS.
Ikhadi leBlog blog # 1
Omnye ikhadi elikhulu loyilo ethi phantse yonke into emelwe ngumfanekiso, ungaya kwi codepen.io ukufumana ikhowudi ehambelana nokuyifaka kwiwebhusayithi yakho.
Amakhadi eeNdaba zeCSS kuphela i-CSS
Eli khadi, kunye Izinto ezingaqhelekanga njengemvelaphi, ivelela oopopayi bayo abagudileyo obuveza umxholo. Icocekile iCSS.
Umxholo wePosti yeBhlog
Imboniso yewebhu ngokuzisa isikhombisi semouse phezu kwayo. Ine-CSS kunye ne-HTML ngokudibanisa ngokulula.
Amakhadi ebhlog
Uyilo lwekhadi lebhlog eliphendulayo elincinci. Ukukhawuleza kunye nokugqithisa umgangatho ophezulu ongashiyi nabani na ongenamdla.
Amakhadi oshishino aphendulayo
Ukuma ngaphandle kwe- oopopayi abancinci ngokuhambisa isikhombisi semouse ngaphezulu komfanekiso wekhadi.
Elinye ikhadi lebhlog
Ivela i ikhadi xa ubhabha ngokufanayo.
Amakhadi oshishino
Omnye ikhadi elilula kodwa langoku ndwendwela kunye nedemo kunye nekhowudi kwi-HTML nakwi-CSS.
Ikhadi leshishini le3D
Eli khadi lifanelekile oopopayi be3D ngeHTML kunye neCSS. Yenziwe ngu-Elena Nazarova, ilungile kwikhadi leshishini elibetha umbala.
Ikhadi leshishini leCSS
Ikhadi leshishini elibalaseleyo kwi-CSS leyo ujikeleza kwi-3D ukwenza uluhlu lothotho lweedilesi ze-URL eziphendula kwisikhombisi semouse ngeli xesha silibeka phantsi.
Iigridi zekhadi
Uthotho lwamakhadi abekwe kakuhle ane uyilo olutsala amehlo. Kuyamangalisa ukusebenza kwayo ngokulula, kodwa ngokubetha okuhle kwikhowudi ye-HTML, CSS kunye ne-SCSS.
Amakhadi e-3D atyhilwa
Olu luhlu lweigridi zamakhadi kutyhila ulwazi oluninzi ngalo mzuzu ukuba sishiye imouse kwi-icon eluhlaza. Ngexesha elifanayo lokushiya isikhombisi, yonke iigridi ihamba ngokufanelekileyo.
IKhadi loYilo lweMpahla
Nge ulwimi loyilo lukaGoogle, olu luhlu lwamakhadi lubonakala luphawu lwe menyu oluvula lonke ulwazi lwabadlali njengakwimeko yomzekelo. Oopopayi abahle kunye nabanomdla ngokubonakalayo okuhle.
Igridi yekhadi leFlexbox
Umzekelo wekhadi kubude obufanayo ababonakala bevela ukusebenzisa ifomathi yebhokisi ye-flexbox. Elinye lamaxabiso aso kukusetyenziswa kwemilinganiselo yeCSS kunye neefilitha zeCSS.
Ukuxabana kwamakhadi ezindlu
El umdlalo weselula othandwayo inamakhadi ayo kwi-HTML nakwi-CSS eyenziwe ngu-Andre Madarang. Singadlula phakathi kwabo ngokuchanekileyo nangokubonwayo.
Isilayidi amakhadi eCommerce
Nge oopopayi be-agile, la makhadi ayakukhuthaza ukuba ukhangele izinto zabo ukuze ufumanise ukuba zingantoni na. Uyilo olukhulu oluvela ku-Omar Dsoky.
Uyilo lojongano-iKhadi leMveliso
Ikhadi elifanelekileyo lokuyila ezo Imveliso yeCommerce yethu. Yenziwe nge-HTML kunye ne-CSS.
Ikhadi lemveliso
Ukusuka kwikhadi elifanayo sinakho yiya kwimifanekiso eliqela ukubona ngcono imveliso. Ibandakanya ukongeza kwiqhosha lenqwelo kwaye iqulethe i-HTML, CSS kunye nekhowudi yeJavaScript.
Amakhadi eMveliso yeFlexy
Njengoko igama layo libonisa, isebenzisa i-flexbox ukwenza oopopayi abanomdla xa ucofa ukongeza kwiqhosha lenqwelo.
Amakhadi eflip
Ikhowudi encinci yamanye amakhadi agudileyo kunye oopopayi abagqibeleleyo. Kwimizuzu nje embalwa ungazibandakanya. Kutshanje kufakwe kwi-codepen.
Amakhadi njengamakhadi eMveliso ye3D
Kufuneka kuqatshelwe ukuba la makhadi ngokungathi sinothotho lwamakhadi etafileni. Isikhombisi sishiyekile kwaye sondeza, cofa nganye, kwaye ubonise umva wekhadi ukubonisa ulwazi ngemveliso. Sicofa kwakhona kwaye sishiya njengoko bekunjalo ngaphambili. Ukugqibelela ekufundeni iipropathi ze-3D CSS.
Ikhadi leParallax
Uvavanyo olubonakalayo olubonakalayo iflip yokubamba iso. Kungcono ukuba uyibone ukuze uyazi ukuba ithetha ngantoni.
Ukuhambisa isiphumo samakhadi
Iziphumo ezilula kodwa hover gimmicky malunga namakhadi.
Impembelelo elula yokuhamba
Ukubetha isiphumo esilula, kodwa oko kunefuthe elikhulu kumzuzu esiwubonayo.
Amakhadi anzulu eParallax
La makhadi athwele i Ingqondo yeparallax ukuya phezulu ukwenza amakhadi aqaqambe kakhulu ngokuyilwa. Kuya kufuneka uyibone ukuze uqonde ngcono isiphumo esivelisayo kumsebenzisi xa ukhetha ezinye zeendidi kwibhlog yethu.
Ikhadi le-UI leemovie
Ikhadi le Uyilo olukhulu olwenziwe nge-HTML kunye neCSS.
Ikhadi leprofayile
Kakhulu oopopayi abalungileyo Ikhadi lokunxibelelana apho sinokuphumeza ukufikelela kwiiprofayili zemidiya yoluntu. I-HTML kunye neCSS.
Amakhadi ahlanganisiweyo ePolaroid
Ngeepropathi, amacebo okucoca kunye Ukutshintsha kwesiko kweCSS Olu luhlu lwamakhadi angamaqela ePolaroid ayenziwe; ungaphoswa yile mifanekiso ye-SVG.
Kuya kuba nakho ukufaka naliphi na kula makhadi kwiphepha elinamagama
NDIYABATHANDA