html怎么设置div阴影
生活随笔
收集整理的這篇文章主要介紹了
html怎么设置div阴影
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
html設置div陰影的方法:使用css樣式中“box-shadow”屬性為div添加陰影效果,只需要在html中添加“box-shadow: 0px 0px 100px 10PX black;”樣式代碼設置陰影效果即可。
示例代碼:
<!DOCTYPEhtml><html>
<head>
<metacharset="utf-8">
<title>陰影效果</title>
<styletype="text/css">
div{
position:absolute;
left:300px;
top:300px;
width:300px;
height:300px;
box-shadow:0px0px100px10PXblack;
border:1pxsolidblack;
}
</style>
</head>
<body>
<div>
</div>
</body>
</html>
效果如下:
box-shadow 向框添加一個或多個陰影。該屬性是由逗號分隔的陰影列表,每個陰影由 2-4 個長度值、可選的顏色值以及可選的 inset 關鍵詞來規定。省略長度的值是 0。
語法:
box-shadow:h-shadowv-shadowblurspreadcolorinset;
屬性值:
-
h-shadow 必需。水平陰影的位置。允許負值。
-
v-shadow 必需。垂直陰影的位置。允許負值。
-
blur 可選。模糊距離。
-
spread 可選。陰影的尺寸。
-
color 可選。陰影的顏色。
-
inset 可選。將外部陰影 (outset) 改為內部陰影。
總結
以上是生活随笔為你收集整理的html怎么设置div阴影的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: python 浏览器,轻量级Python
- 下一篇: 360购物小蜜怎么用