Style boxShadow 屬性
示例
為 div 元素新增一個盒陰影
document.getElementById("myDIV").style.boxShadow = "10px 20px 30px blue";自己動手試一試 »
描述
boxShadow 屬性設定或返回盒元素的投影。
瀏覽器支援
| 屬性 | |||||
|---|---|---|---|---|---|
| boxShadow | 是 | 9.0 | 是 | 5.1 | 是 |
語法
返回 boxShadow 屬性
object.style.boxShadow
設定 boxShadow 屬性
object.style.boxShadow = "none|h-shadow v-shadow blur spread color |inset|initial|inherit"
注意：boxShadow 屬性為盒子新增一個或多個投影。該屬性是一個逗號分隔的陰影列表，每個陰影由 2-4 個長度值、一個可選顏色和一個可選的 inset 關鍵字指定。省略的長度為 0。
屬性值
| 值 | 描述 |
|---|---|
| none | 預設值。不顯示陰影 |
| h-shadow | 必需。水平陰影的位置。允許負值 |
| v-shadow | 必需。垂直陰影的位置。允許負值 |
| blur | 可選。模糊距離 |
| spread | 可選。陰影的大小 |
| color | 可選。陰影的顏色。預設值為黑色。有關可能顏色值的完整列表，請參閱CSS 顏色值。 注意：在 Safari（PC 版）中，顏色引數是必需的。如果您未指定顏色，則根本不顯示陰影。 |
| inset | 可選。將陰影從外陰影（outset）更改為內陰影 |
| initial | 將此屬性設定為其預設值。閱讀關於 initial |
| inherit | 從其父元素繼承此屬性。閱讀關於 inherit |
技術詳情
| 預設值 | none |
|---|---|
| 返回值 | 一個字串，表示元素的 box-shadow 屬性 |
| CSS 版本 | CSS3 |
相關頁面
CSS 參考：box-shadow 屬性
