Style boxShadow ominaisuus
- Edellinen sivu Alas
- Seuraava sivu boxSizing
- Palaa ylös HTML DOM Style-objekti
Määrittely ja käyttö
boxShadow
Ominaisuus asettaa tai palauttaa kehän heijastuksen (drop-shadow).
Katso myös:
CSS viittausoppikirja:box-shadow ominaisuus
Esimerkki
Lisää box-shadow div-elementille:
document.getElementById("myDIV").style.boxShadow = "10px 20px 30px blue";
Syntaksi
Palauta boxShadow ominaisuus:
objekti.style.boxShadow
Aseta boxShadow ominaisuus:
objekti.style.boxShadow = "none|h-shadow v-shadow blur spread color |inset|initial|inherit"
Huomautus:boxShadow
Ominaisuus lisää kehään yhden tai useamman varjon. Tämä ominaisuus on pilkkuera muodossa oleva varjojen luettelo, jossa jokainen varjo määritetään 2-4 pituusarvon, valinnaisen väriarvon ja valinnaisen 'inset'-avainsanan avulla. Pituuksien puuttuessa arvo on 0.
Ominaisuusarvo
Arvo | Kuvaus |
---|---|
none | Oletusarvo. Ei näy varjoa. |
h-shadow | Pakollinen. Vaakasuuntainen varjon sijainti. Sallitaan negatiiviset arvot. |
v-shadow | Pakollinen. Pystysuuntainen varjon sijainti. Sallitaan negatiiviset arvot. |
blur | Valinnainen. Pehmennysetäisyys. |
spread | Valinnainen. Varjon koko. |
color |
Valinnainen. Väri varjoa. Oletusarvo on musta. Tarkista CSS-väriarvot,saadaksesi täydellisen listan mahdollisista väriarvoista. Vinkki:Safarissä (tietokoneella)color Parametri on pakollinen. Jos ei määritetä väriä, varjo ei näy ollenkaan. |
inset | Valinnainen. Vaihda ulkoinen varjo (outset) sisäiseen varjoon. |
initial | Aseta tämä ominaisuus sen oletusarvoon. Katso initial。 |
inherit | Perii tämän ominaisuuden vanhemmalta elementiltään. Katso inherit。 |
Tekninen yksityiskohta
Oletusarvo: | ei mitään |
---|---|
Palautusarvo: | merkkijono, joka ilmaisee elementin box-shadow ominaisuus。 |
CSS-versio: | CSS3 |
Selaimen tuki
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
Tuki | 9.0 | Tuki | 5.1 | Tuki |
- Edellinen sivu Alas
- Seuraava sivu boxSizing
- Palaa ylös HTML DOM Style-objekti