Sliki dodajte učinek sence slikam s CSS3 samodejnim generatorjem kode

click fraud protection

CSS vam omogoča preprosto, zelo enostavno oblikovanje spletnih strani. Na eni strani lahko določite več kot sto slogov besedila (seveda bo vaša stran videti kot cirkuški šotor), vendar gre za enostavnost in fleksibilnost, ki jo dobite pri uporabi CSS na spletnih straneh.ThemeShock ima generator kodirnikov CSS, ki vam bo v nekaj preprostih klikih dodal različne učinke senčil. Izberete učinek in zapiše kodo; učinki se lahko dodajo na dnu, ob straneh, zgoraj in spodaj, levo spodaj, desno spodaj, zgoraj desno in spodaj levo ali v diagonalnih kotih.

css-shadow-generator_HQ

Preden začneš; preverite dimenzijo svoje slike (tisto, ki ji želite dodati učinek). Generator kode ima vnaprej določeno zgornjo in spodnjo mejo 130 - 347px za širino in višino slike. Če dimenzije slike presegajo to, lahko širino in višino vedno uredite pozneje. Koda vam omogoča tudi določitev motnosti in zamegljenosti sence. Svoje slike ne morete naložiti v generator kod, uporabljena bo privzeta slika, da si lahko ogledate učinek.

V spustnem meniju izberite, kateri učinek sence vam je všeč, vsakič, ko spremenite katerega koli od izbirnikov, se ustvari nova koda, zato se prepričajte, da uporabljate najnovejšo. Ko izberete želeni učinek, nastavite širino in višino slike s pomočjo vodoravne drsne vrstice. Če želite malo pritisniti gumb, uporabite desno in levo tipko s puščicami. Nastavite zameglitev in motnost, nastala bo koda. Če povečanje ali zmanjšanje katerega koli od teh parametrov ustvari novo kodo.

instagram viewer

Css3 spustna senca

Ko je vse nastavljeno, kopirajte CSS kodo v datoteko CSS in jo poimenujte za svojo spletno stran (ali temo). Ustvari se tudi koda HTML, ki se nahaja na vaši spletni strani (edinstvena je za vsak izbrani učinek iz spustnega menija) ga kopirajte in postavite slikovno kodo (img src = ”“), kjer piše “vaša koda tukaj.

Najboljša stvar tega generatorja kod je, da deluje in je brezplačen. Ima omejitve dimenzij za slike, vendar jih je mogoče urejati iz kode. Če uporabite prozorno sliko (kot je zgoraj), bo dala dolgo sivo ozadje. Kasneje lahko uredite barvo ozadja iz kode. (Uredi ozadje kode vrstice: #ccc). Koda daje tudi 5px okvir vsem slikam, lahko uredite tudi okvir, vendar s povečanjem in zmanjšanjem širine se skriva ali razkrije senca več kot je potrebno, tako da je najbolje pustiti pri miru.

Obiščite ThemeShock CSS Generator spuščanja senc

watch instagram story