描述
The drop-shadow() CSS function applies a drop shadow effect to the input image. Its result is a <filter-function>
.
语法
drop-shadow(offset-x offset-y blur-radius spread-radius color)
参数
- offset-x:此参数设置图像的水平偏移,正值将创建右侧的偏移量,负值将创建左侧的偏移量。
- offset-y:此参数设置图像的垂直偏移,正值创建到底部的偏移量,负值创建到顶部的偏移量。
- blur-radius:设置模糊半径的值,它是一个可选参数。
- spread-radius:设置扩散半径的值,它是一个可选参数。
- color:它设置阴影的颜色,它是可选参数。
视觉
相当于光穿过一个物体而形成的影子,如果该物体中间有透明色,光也会穿过透明的区域,形成的投影中间也会有光的颜色。
例子
.effect-shadow {
filter: drop-shadow(5px 5px 10px black);
}