语法格式:
box-shadow:水平位置 垂直位置 模糊距离 阴影尺寸(影子大小) 阴影颜色 内/外阴影;
1.前两个属性必须写,其余可省略
2.外阴影(outset)但是不能写 默认 想要内阴影 inset
| 值 | 描述 |
|---|---|
| h-shadow | 必须,水平阴影的位置,允许负值 |
| v-shadow | 必须。垂直阴影位置,允许负值 |
| blur | 可选,模糊距离 |
| spread | 可选,阴影尺寸 |
| color | 可选,阴影颜色 |
| inset | 可选,将外部阴影(outset)改为内部阴影 |
div {
width: 200px;
height: 200px;
border: 10px solid #000;
box-shadow: 5px 5px 3px 4px rgba(0,0,0,0.4) inset;
/*box-shadow:水平位置 垂直位置 模糊距离 阴影尺寸(影子大小) 阴影颜色 内/外阴影;*/
}
本文深入讲解CSS中的Box Shadow属性,包括其语法格式、各参数的意义及用法,如水平和垂直阴影位置、模糊距离、阴影尺寸、阴影颜色及内外阴影的区别。通过实例代码展示如何设置复杂的阴影效果。
1515

被折叠的 条评论
为什么被折叠?



