效果图如下:
html:
<div id="talk">
空心三角形
</div>
css:
#talk{
margin-top: 50px;
margin-bottom: 50px;
width: 120px;
height: 80px;
position: relative;
border-radius: 10px;
border: 1px solid #000000;
}
#talk:before{
content: '';
position: absolute;
left: 58px;
top: 79px;
border-right: 15px solid transparent;
border-top: 15px solid #000000;
border-left: 15px solid transparent;
}
#talk:after{
content: '';
position: absolute;
left: 58px;
top: 77px;
border-right: 15px solid transparent;
border-top: 15px solid #ffffff;
border-left: 15px solid transparent;
}