Style boxShadow-egenskap

Definition och användning

boxShadow Egenskapen ställer in skuggan (drop-shadow) för rutelementet.

Se också:

CSS referenshandbok:box-shadow egenskap

Exempel

Lägg till box-shadow till div-elementet:

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

Prova själv

Syntax

Returnera boxShadow-egenskapen:

object.style.boxShadow

Ställ in boxShadow-egenskapen:

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

Kommentar:boxShadow Egenskapen lägger till en eller flera skuggor till rutan. Egenskapen är en kommatecken-separerad lista över skuggor, varje skugga definieras av 2-4 längdvärden, valfritt färgvärde och valfritt 'inset'-nyckelord. Uppreparade värden är 0.

Egenskapsvärde

Värde Beskrivning
none Standardvärde. Ingen skugga visas.
h-shadow Nödvändig. Horisontalskuggans position. Tillåter negativa värden.
v-shadow Nödvändig. Vertikalskuggans position. Tillåter negativa värden.
blur Valfritt. Suddig avstånd.
spread Valfritt. Skuggans storlek.
color

Valfritt. Skuggans färg. Standardvärdet är svart.

Se CSS-färgvärdenför en fullständig lista över möjliga färgvärden.

Tips:I Safari (på PC),color Parametern är nödvändig. Om inte färg specificeras, visas skuggan inte alls.

inset Valfritt. Byt från extern skugga (outset) till intern skugga.
initial Sätt denna egenskap till dess standardvärde. Se initial
inherit Får denna egenskap från sin föräldrelement. Se inherit

Tekniska detaljer

Standardvärde: Ingen
Returvärde: sträng som representerar elementets box-shadow egenskap
CSS-version: CSS3

Webbläsarstöd

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Stöd 9.0 Stöd 5.1 Stöd