Stijl boxShadow eigenschap

Definitie en gebruik

boxShadow Eigenschap instellen of teruggeven van de schaduw (drop-shadow) van het kader-element.

Zie ook:

CSS-handboek:box-shadow eigenschap

Voorbeeld

Voeg een box-shadow toe aan het div-element:

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

Probeer het zelf

Syntaxis

Terugkeergewenste waarde van de boxShadow eigenschap:

object.style.boxShadow

Instellen van de boxShadow eigenschap:

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

Opmerking:boxShadow Deze eigenschap voegt een of meerdere schaduwen toe aan het kader. De eigenschap is een lijst van schaduwen, gescheiden door komma's, en elke schaduw wordt gedefinieerd door 2-4 lengtewaarden, optionele kleurwaarden en optionele 'inset'-trefwoorden. Waarden die worden weggelaten zijn 0.

Eigenschapswaarde

Waarde Beschrijving
none Standaardwaarde. De schaduw wordt niet weergegeven.
h-shadow Vereist. De horizontale positie van de schaduw. Negatieve waarden zijn toegestaan.
v-shadow Vereist. De verticale positie van de schaduw. Negatieve waarden zijn toegestaan.
blur Optioneel. De vervaagingsafstand.
spread Optioneel. De grootte van de schaduw.
kleur

Optioneel. De kleur van de schaduw. De standaardwaarde is zwart.

Bekijk CSS-kleurenwaardenvoor een volledige lijst van mogelijke kleurwaarden.

Tip:In Safari (op PC)kleur De parameter is vereist. Als er geen kleur wordt gedefinieerd, wordt de schaduw niet weergegeven.
inset Optioneel. Verander de externe schaduw (outset) in een interne schaduw.
initial Stel deze eigenschap in op zijn standaardwaarde. Raadpleeg initial.
inherit Deze eigenschap overneemt van de ouder-element. Raadpleeg inherit.

Technische details

Standaardwaarde: geen
terugkeergewenste waarde: tekst, die de box-shadow eigenschap.
CSS version: CSS3

Browser support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support 9.0 Support 5.1 Support