<div class="test1">
<span class="bot1"></span>
<span class="top1"></span>
气泡
</div>
.test1 {
margin-top: 20px;
width: 300px;
padding: 30px 20px;
margin-left: 60px;
background: #cccccc;
position: relative;
border-radius: 50px;
}
.test1 span {
width: 0;
height: 0;
font-size: 0;
overflow: hidden;
position: absolute;
}
.test1 span.bot1 {
border-width: 20px;
border-style: solid;
border-color: #cccccc #cccccc #ffffff #ffffff;
top: 1px;
left: -36px;
border-radius: 15px;
}
.test1 span.top1 {
border-width: 10px 20px;
border-style: solid solid dashed dashed;
border-color: #ffffff #ffffff transparent transparent;
left: -36px;
top: 1px;
}