Style boxShadow 屬性
- 上一頁 bottom
- 下一頁 boxSizing
- 返回上一層 HTML DOM Style 對象
實例
為 div 元素添加 box-shadow：
document.getElementById("myDIV").style.boxShadow = "10px 20px 30px blue";
語法
返回 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 上）中，color 參數是必需的。如果不規定顏色，則根本不顯示陰影。 |
| inset | 可選。將外部陰影 (outset) 改為內部陰影。 |
| initial | 將此屬性設置為其默認值。請參閱 initial。 |
| inherit | 從其父元素繼承此屬性。請參閱 inherit。 |
技術細節
| 默認值： | 無 |
|---|---|
| 返回值： | 字符串，表示元素的 box-shadow 屬性。 |
| CSS 版本： | CSS3 |
瀏覽器支持
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 支持 | 9.0 | 支持 | 5.1 | 支持 |
- 上一頁 bottom
- 下一頁 boxSizing
- 返回上一層 HTML DOM Style 對象
