本文给大家分享使用纯css写的一个边沿打孔效果，需要的朋友参考下

项目中用到了这个边沿打孔的效果，尝试下来使用纯css写的这个样式，在这里分享一下： 效果大致如图 分步实现思路： 1，先画两个带圆角的框，A和B（A、B分别需要加投影效果，图上没有做） 2，在B的左右两条缝隙的地方分别画一排圆（其实是正方形用了50%的圆角），圆填充色和背景色相同（此处背景色是白色，所以圆的填充是白色） 3，给圆孔加上内阴影，达到真实的打孔效果，这里用到的是这样的css： box-shadow:0 1px 1px rgba(0,0,0,0.2) inset; 4，此时