Dodaj efekt cienia do zdjęć za pomocą CSS3 Auto Code Generator

CSS pozwala łatwo, bardzo łatwo stylizować strony internetowe. Możesz zdefiniować ponad sto stylów tekstu na jednej stronie (oczywiście twoja strona będzie wyglądać jak namiot cyrkowy), ale chodzi o łatwość i elastyczność związaną z używaniem CSS na stronach internetowych.ThemeShock ma generator koderów CSS, który pomoże Ci dodać różne efekty cienia do twoich zdjęć za pomocą kilku prostych kliknięć. Ty wybierasz efekt, a on zapisuje kod; efekty można dodawać do dołu, boków, góry i dołu, u dołu po lewej, u dołu po prawej, u góry po prawej i u dołu po lewej lub w ukośnych rogach.

Zanim zaczniesz; sprawdź wymiar swojego obrazu (ten, do którego chcesz dodać efekt). Generator kodu ma wstępnie zdefiniowaną górną i dolną granicę 130–347 pikseli dla szerokości i wysokości obrazu. Jeśli wymiary twojego obrazu przekraczają to, zawsze możesz później edytować szerokość i wysokość. Kod pozwala także określić krycie i rozmycie cienia. Nie możesz załadować swojego obrazu do generatora kodu, zostanie użyty domyślny obraz, abyś mógł zobaczyć podgląd efektu.

Z rozwijanego menu wybierz efekt cienia, który Ci się podoba, za każdym razem, gdy zmienisz jeden z selektorów, generowany jest nowy kod, więc upewnij się, że używasz najnowszego. Po wybraniu pożądanego efektu ustaw szerokość i wysokość obrazu za pomocą poziomego paska przewijania. Użyj klawiszy strzałek w prawo i w lewo, jeśli chcesz trochę nacisnąć przycisk. Ustaw rozmycie i krycie, a kod zostanie wygenerowany. Zwiększenie lub zmniejszenie jednego z tych parametrów spowoduje utworzenie nowego kodu.

Po ustawieniu wszystkiego skopiuj kod CSS do pliku CSS i nazwij go dla swojej strony internetowej (lub motywu). Generowany jest również kod HTML znajdujący się na stronie (jest unikalny dla każdego wybranego efektu z menu rozwijanego), skopiuj go i umieść kod obrazu (img src = ”„) tam, gdzie jest napisane „Twój kod tutaj'.

Najlepszą rzeczą w tym generatorze kodów jest to, że działa i jest bezpłatny. Ma ograniczenia wymiarowe dla obrazów, ale można je edytować z kodu. Jeśli użyjesz przezroczystego obrazu (takiego jak powyższy), da on matowe szare tło. Możesz edytować kolor tła później z kodu. (Edytuj tło linii kodu: #ccc). Kod daje również ramkę o wielkości 5 pikseli dla wszystkich obrazów, możesz również edytować ramkę, ale zwiększenie i zmniejszenie szerokości ukryje lub odsłoni cień bardziej niż to konieczne, więc najlepiej zostawić go w spokoju.

Odwiedź ThemeShock CSS Drop Shadow Generator