css怎样生成反方向圆角

Question

下面这个效果（这个小口）怎么生成？

Answer 1

正常用css画两个圆，然后通过具体定位放置在相应的位置就可以了。
父级元素relative，圆absolute，然后通过top、left、right、bottom来设置具体出现位置。
这不是唯一办法，选择一种你觉得最舒服的方式就行。

Answer 2

<div style="width:300px; height:300px; position:relative; background-color:#000">
<div style="width:30px; height:30px; border-radius:50%; position:absolute; top:-15px; right:-15px; background-color:#fff"></div>
</div>
用一个背景颜色的圆定位。

Answer 3

after一个div 高宽一样 border-radius:50% background-color设置成那个灰色北京 之后定为到对应位置