Pridėkite šešėlio efektą prie vaizdų naudodami CSS3 automatinį kodų generatorių

click fraud protection

CSS leidžia lengvai, labai lengvai formuoti savo tinklalapius. Viename puslapyje galite apibrėžti daugiau nei šimtą teksto stilių (žinoma, jūsų puslapis pasirodys panašus į cirko palapinę), tačiau kalbama apie patogumą ir lankstumą, kurį suteikia CSS naudojimas tinklalapiuose.„ThemeShock“ turi CSS kodų generatorių, kuris padės keliais paprastais paspaudimais prie vaizdų pridėti įvairius šešėlių efektus. Jūs pasirenkate efektą ir jis parašo kodą; efektus galima pridėti apačioje, šonuose, viršuje ir apačioje, kairėje apačioje, apačioje dešinėje, viršuje dešinėje ir apačioje kairėje arba įstrižainiuose kampuose.

css-shadow-generator_HQ

Prieš tau pradedant; patikrinkite savo vaizdo matmenis (tą, prie kurio norite pridėti efektą). Kodo generatoriaus iš anksto nustatyta viršutinė ir apatinė vaizdo pločio ir aukščio riba yra 130 - 347 pikseliai. Jei jūsų vaizdo matmenys viršija šį dydį, visada galite vėliau redaguoti plotį ir aukštį. Kodas taip pat leidžia nustatyti šešėlio nepermatomumą ir neryškumą. Negalite įkelti savo vaizdo kodo generatoriuje. Bus naudojamas numatytasis vaizdas, kad galėtumėte peržiūrėti efektą.

instagram viewer

Išskleidžiamajame meniu pasirinkite, kuris šešėlio efektas jums patinka, kiekvieną kartą keičiant bet kurį iš rinkiklių, sukuriamas naujas kodas, todėl įsitikinkite, kad naudojate patį naujausią. Pasirinkę jums patinkantį efektą, nustatykite vaizdo plotį ir aukštį naudodami horizontalią slinkties juostą. Jei norite šiek tiek paspausti mygtuką, naudokite rodyklę dešinėn ir kairėn. Nustatykite neryškumą, bus sukurtas neskaidrumas ir kodas. Padidinus ar sumažinus bet kurį iš šių parametrų, bus sukurtas naujas kodas.

„Css3“ lašas

Kai viskas bus nustatyta, nukopijuokite CSS kodą į CSS failą ir pavadinkite jį savo tinklalapiu (arba tema). Taip pat sugeneruojamas jūsų tinklalapyje esantis HTML kodas (jis yra unikalus kiekvienam jūsų pasirinktam efektui iš išskleidžiamojo meniu), nukopijuokite jį ir įdėkite vaizdo kodą (img src = ”“) ten, kur rašoma „jūsų kodas čia “.

Geriausias šio kodo generatoriaus dalykas yra tai, kad jis veikia ir yra nemokamas. Jis vis dar turi vaizdų apribojimus, tačiau juos galima redaguoti iš kodo. Jei naudosite skaidrų vaizdą (kaip antai aukščiau), jis suteiks nuobodu pilką foną. Vėliau galite redaguoti fono spalvą iš kodo. (Redaguoti kodo eilutės foną: #ccc). Kodas taip pat suteikia 5 pikselių kadrą visiems paveikslėliams, taip pat galite redaguoti rėmelį, tačiau padidinus ir sumažinus plotį, šešėlis paslėps arba atskleis daugiau nei būtina, todėl geriau jį palikti ramybėje.

Apsilankykite „ThemeShock CSS Drop Shadow Generator“

watch instagram story