- - Pridajte tieňový efekt k obrázkom pomocou automatického generátora kódov CSS3

Pridajte tieňový efekt k obrázkom pomocou automatického generátora kódov CSS3

CSS vám umožňuje veľmi ľahko upravovať vaše webové stránkyľahko. Na jednej stránke môžete definovať viac ako sto textových štýlov (samozrejme, že vaša stránka bude vyzerať ako cirkusový stan), ale je to o ľahkosti a flexibilite, ktorá sa vyskytuje pri používaní CSS na webových stránkach.ThemeShock má generátor CSS kodéra, ktorý vám pomôže pridaťpomocou niekoľkých efektov tieňového efektu na svoje obrázky pomocou niekoľkých jednoduchých kliknutí. Vyberiete efekt a zapíše kód; efekty môžu byť pridané do spodnej, bočnej, hornej a dolnej časti, doľava dole, vpravo dole, vpravo hore a dole vľavo alebo v diagonálnych rohoch.

css-shadow-generator_HQ

Predtým ako začneš; skontrolujte rozmer svojho(obrázok, do ktorého chcete efekt pridať). Generátor kódu má preddefinovanú hornú a dolnú hranicu 130 - 347px pre šírku a výšku obrázka. Ak vaše rozmery obrázka prekročia túto hodnotu, môžete šírku a výšku kedykoľvek upraviť. Kód tiež umožňuje určiť nepriehľadnosť a rozmazanie tieňa. Nemôžete nahrať svoj obrázok do generátora kódu, použije sa predvolený obrázok, aby ste si mohli pozrieť jeho efekt.

Z rozbaľovacej ponuky vyberte, ktorý tieň sa zobrazíefekt sa vám páči, zakaždým, keď zmeníte niektorý z voličov, vygeneruje sa nový kód, takže nezabudnite použiť ten najnovší. Po výbere požadovaného efektu nastavte šírku a výšku obrázka pomocou vodorovnej posúvacej lišty. Ak chcete stlačiť tlačidlo len trochu, použite tlačidlá so šípkami doprava a doľava. Nastavte rozmazanie a krytie a vygeneruje sa kód. Zvýšením alebo znížením jedného z týchto parametrov sa vytvorí nový kód.

Vrhaný tieň Css3

Akonáhle je všetko nastavené, skopírujte kód CSS doSúbor CSS a pomenujte ho pre svoju webovú stránku (alebo tému). Generuje sa aj kód HTML, ktorý sa nachádza na vašej webovej stránke (je jedinečný pre každý efekt, ktorý vyberiete z rozbaľovacej ponuky), skopírujte ho a umiestnite kód obrázka (img src = ““), kde sa uvádza text „tu zadajte svoj kód“.

Najlepšie na tomto generátore kódu je tofunguje to a je to zadarmo. Má obmedzenia rozmerov pre obrázky, ale je možné ich upravovať z kódu. Ak použijete priehľadný obrázok (ako je uvedený vyššie), bude mať matne sivé pozadie. Farbu pozadia môžete neskôr upraviť z kódu. (Upraviť pozadie riadku kódu: #ccc). Kód tiež dáva rámcom 5px všetky obrázky, môžete ho tiež upraviť, ale zväčšenie a zmenšenie šírky zakryjú alebo odhalia tieň viac, ako je potrebné, takže je najlepšie nechať ho na pokoji.

Navštívte ThemeShock CSS Generátor tieňov

Komentáre