Style boxShadow Eigenschaft

Definition und Verwendung

boxShadow Eigenschaft, um den Schatten (drop-shadow) des Rahmens zu setzen oder zurückzugeben.

Weitere Informationen:

CSS-Referenzhandbuch:box-shadow Eigenschaft

Beispiel

box-shadow zu div-Element hinzufügen:

document.getElementById("myDIV").style.boxShadow = "10px 20px 30px blue";

Versuchen Sie es selbst

Syntax

box-shadow Eigenschaft zurückgeben:

object.style.boxShadow

box-shadow Eigenschaft setzen:

object.style.boxShadow = "none|h-shadow v-shadow blur spread color |inset|initial|inherit"

Anmerkung:boxShadow Diese Eigenschaft fügt einem Rahmen eine oder mehrere Schatten hinzu. Der Schatten ist eine durch Kommas getrennte Liste von Schatten, die aus 2-4 Längenwerten, optionalen Farben und optionalen 'inset'-Schlüsselwörtern bestehen. Ausgelassene Längenwerte sind 0.

Eigenschaftswert

Wert Beschreibung
none Standardwert. Kein Schatten angezeigt.
h-shadow obligatorisch. Horizontale Position des Schattens. Negative Werte sind erlaubt.
v-shadow obligatorisch. Vertikale Position des Schattens. Negative Werte sind erlaubt.
blur optional. Weichzeichnungsdistanz.
spread optional. Größe des Schattens.
color

optional. Farbe des Schattens. Standardwert ist schwarz.

Siehe CSS-Farbefür eine vollständige Liste möglicher Farben.

Hinweis:In Safari (PC)color Der Parameter ist obligatorisch. Wird keine Farbe angegeben, wird der Schatten nicht angezeigt.
inset optional. Ändere die äußeren Schatten (outset) in innere Schatten.
initial Diese Eigenschaft auf ihren Standardwert setzen. Siehe initial。
inherit Diese Eigenschaft wird von ihrem übergeordneten Element geerbt. Siehe inherit。

Technische Details

Standardwert: keine
Rückgabewert: Zeichenkette, die den box-shadow Eigenschaft。
CSS-Version: CSS3

Browser-Unterstützung

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Unterstützung 9.0 Unterstützung 5.1 Unterstützung