切图网专注于html5前端切图开发，下面给大家介绍一下前端切图css高级阴影用法drop-shadow，主要是在最近项目切图中遇到的，通常我们了解的css的阴影写法就是shadow，但是它不能解决非规则图形的阴影效果，而drop-shadow可以做到。

给图像设置一个阴影效果。阴影是合成在图像下面，可以有模糊度的，可以以特定颜色画出的遮罩图的偏移版本。参数与box-shadow类似。但inset关键字不允许。

<div class="shadow">不规则边框</div>

.shadow{color: #fff;font-size: 24px;text-align: center;width: 200px;height: 200px;line-height: 200px;/*渐变背景制作圆缺角*/background:radial-gradient(circle at top left, transparent 25px, red 0) top left,radial-gradient(circle at top right, transparent 25px, red 0) top right,radial-gradient(circle at bottom right, transparent 25px, red 0) bottom right,radial-gradient(circle at bottom left, transparent 25px, red 0) bottom left;background-size: 50% 50%;background-repeat: no-repeat;/*不规则阴影*/filter:drop-shadow(0 0 12px rgba(0,0,0,0.5));}