前段时间在做一个需求，是一个活动落地页并不复杂，但是因为一处样式差点搞破防了。
蓝色框框的位置是遮盖在banner上面，不能用png图片代替，因为落地页中这些色值都是后台配置好前端调接口获取的，所以不能写死。
期间想到的方案是用canvas绘制出banner背景然后再画出这些图形，又或者svg？..嗯 这种方法个人觉得并不是方便（俺就是懒） 暂且算做兜底方案，又尝试使用css的clip-path 但并不能实现设计图中的效果（头发又抓掉几根）。。。
去趟厕所回来脑子灵光一现～ 我们貌似可以用border做出这个效果，虽然设计稿中的线条是两边宽中间细，我们只需要先画出几个比较大的圆环，然后再调整圆环的位置把它们叠在一起....
下面看操作：
简单画了个demo，
问题解决了～
如果还有更好的办法欢迎大佬赐教！
