Ändern Sie die Richtung des vorhandenen CSS -Schattens

Question

Ich habe den folgenden CSS -Schatten:

box-shadow:green 0 1px 3px;

Nun, wenn ich nur die ändern möchte Richtung des Schattens habe ich versucht:

box-shadow:inherit 2px 0 inherit;

Aber das funktioniert leider nicht. Außerdem sieht es nicht so aus, als wären zusätzliche Eigenschaften verfügbar wie:

box-shadow-direction:2px 0;

Oder

box-shadow-color:inherit;

---

Wie kann die Richtung geändert werden, ohne die Farbe oder Stärke zu ändern?

Answer 1

Als ich weiß, dass es keine Subattribute wie gibt background-repeat, margin-left, border-bottom zum box-shadow, text-shadow CSS3 Attribute. Weitere Informationen finden Sie unter: http://www.w3.org/tr/css3-background/#box-shadow .

Die Eigenschaft "Box-Shadow" erhält einen oder mehrere Drop-Shadows an der Box. Die Eigenschaft ist eine von Kommas getrennte Liste von Schatten, die jeweils durch 2-4 Längenwerte, eine optionale Farbe und ein optionales Schlüsselwort "Einschub" angegeben sind. Ausgelassene Längen sind 0; Ausgelassene Farben sind eine ua-chosen-Farbe.

Wo

<shadow> = inset? && [ <length>{2,4} && <color>? ]

Sie können also keine Unterattribute geben wie box-shadow-direction:2px 0; Nach Definition box-shadow zu einem HTML-Element, bis es oder eine ähnliche Unterattribute in den nächsten Versionen von CSS lebte.

Answer 2

Ein Boxschatten ist so definiert: xy Blur -Spread -Farbe.

Wenn Sie also Ihren Box -Schatten verschieben möchten, ändern Sie Ihr X und Y.

box-shadow: 10px 10px 5px #000;

Dieser Code erstellt einen schwarzen Box -Schatten, der 10px von oben und links positioniert ist. (Beachten Sie, dass ich den Spread -Betrag nicht angeben musste.)