边框阴影
CSS边框阴影
1.属性
box-shadow
2.取值
1.h-shadow(必须加) 代表是水平方向阴影
取正值 代表往右偏移
取负值 代表往左偏移
2.v-shadow(必须加) 代表是垂直方向阴影
取正值 代表往下偏移
取负值 代表往上偏移
3.blur(可以加可以不加) 模糊距离
4.spread(可以加可以不加)阴影的尺寸
5.color(可以加可以不加)
6.inset 将外阴影改为内阴影
最常用的
box-shadow:0 0 blur color;
#div1
{
width: 200px;
height:100px;
border:1px solid red;
box-shadow:5px 10px 15px 20px;
}
#div2
{
width: 200px;
height:100px;
border:1px solid red;
box-shadow:5px 10px 15px 20px yellow inset;
/*对应的是水平阴影 垂直阴影 模糊距离 阴影尺寸 阴影颜色 内阴影 */
}
#div3
{
width: 200px;
height:100px;
border:1px solid red;
box-shadow:0 0 10px blueviolet;
/*最常用的是0 0 （blur）模糊距离 （color）颜色*/
}本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2017-10-29，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读