3.20 Bilder mit weichen Schattenwürfen versehen
Problem
Ein Bild soll mit einem weichen Schattenwurf versehen werden.
Lösung
Sie können Schattenwürfe mit weichen Übergängen versehen, wenn Sie das Bild mit einem Paar weiterer nicht-semantischer div
-Tags umgeben.
Zu Beginn erstellen Sie mit einem Grafikprogramm wie Adobe Photoshop (wie in unserem Beispiel) ein neues Bild. Dieses wird als Maske verwendet, die den Schattenwurf aus „3.18 Abgerundete Ecken mit JavaScript“ weicher machen soll. Verwenden Sie hierfür die gleichen Dimensionen wie bei der Grafik für den eigentlichen Schattenwurf. Löschen Sie den kompletten Inhalt der neuen Datei, sodass nur noch der transparente Hintergrund übrig bleibt. Mit dem Verlaufswerkzeug erstellen Sie nun einen Farbverlauf ...
Get CSS Kochbuch now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.