Um Text und Elementen Stil und Design hinzuzufügen, wird der Schatteneffekt verwendet. Es kann einem Element mit dem hinzugefügt werdenBox Schatten”CSS -Eigenschaft. Durch die Verwendung von Kommas können Sie mehrere Effekte gleichzeitig festlegen, ich.e., horizontaler Schatten, vertikaler Schatten, Blur-Radius usw. Diese Eigenschaft bietet verschiedene Funktionen des Bildes mithilfe von Farbkomponenten.
Dieses Handbuch bietet die Methode, die sich auf die Einstellung bezieht “Box Schatten”Nur am Ende eines Elements.
Box-Shadow CSS-Eigenschaft
CSS bietet eine Immobilie mit dem Namen “Box SchattenDas ermöglicht es uns, einen Schatten auf jedes Element oder Bild zu setzen. Diese Eigenschaft hat die folgenden Aspekte:
Syntax
Um diese Punkte zu klären, wechseln wir zur Syntax von Drop-Shadow:
Box-Shadow: Offset-X Offset-y Blur-Radius Farbe;
Lassen Sie uns ein praktisches Beispiel für das implementierenBox Schatten" Eigentum.
Beispiel: So setzen Sie Box Shadow in CSS nur unten in CSS?
Wir werden den Box Shadow -Effekt auf ein Bild anwenden. Zuerst werden wir ein Bild in HTML hinzufügen, und dann werden wir die CSS -Eigenschaft anwendenBox Schatten”Dazu:
Dies gibt die folgende Ausgabe:
Bewegen Sie uns, um einen Schatteneffekt auf die Unterseite des Bildes hinzuzufügen:
img
Box-Shadow: 0px 15px 5px Orange;
Die obigen Werte repräsentieren die folgenden Punkte:
In diesem Bild können wir Schatten unten sehen.
Abschluss
Um den Schatten am unteren Rand des Bildes anzuzeigen, das “Box SchattenEigenschaft wird verwendet. Zu diesem Zweck wird Offset-X als “festgelegt“0”, Offset-Y ist ein positiver Wert, und die Farbe, die Sie anzeigen möchten, ist ebenfalls eingestellt. Mit Hilfe eines Beispiels hat dieser Artikel erklärt, wie Schatten nur am Ende des Bildes angezeigt werden.