box-shadow只要上边阴影
时间: 2023-05-27 14:04:01 浏览: 119
详解CSS3的box-shadow属性制作边框阴影效果的方法
5星 · 资源好评率100%
要实现只有上边有阴影的效果,可以使用如下的CSS代码:
```
box-shadow: 0 -5px 10px rgba(0,0,0,0.5);
```
解析:
- `0`: 表示x轴偏移量,这里不需要水平偏移,所以设置为0;
- `-5px`: 表示y轴偏移量,由于需要将阴影向上偏移,所以设置为-5px;
- `10px`: 表示阴影的模糊半径;
- `rgba(0,0,0,0.5)`: 表示阴影的颜色及透明度,这里设置为黑色,透明度为0.5。
通过上述代码设置之后,只有上边界会有一条深色的阴影线,其他三个方向则没有阴影。
阅读全文