单标签实现气泡三角形
单标签实现气泡三角形
tooltip popup气泡弹出层
这是悬浮的时候，经常出现的 气泡三角
<style>
.comment {
width: 150px;
height: 35px;
position: relative;
margin: 30px auto 0;
background: #f8ac09;
border-radius: 5px;
}
.comment:after {
content: '';
width: 0;
height: 0;
position: absolute;
top: 5px;
left: -16px;
border: solid 8px;
border-color: transparent transparent transparent #f8ac09;
transform: rotate(-180deg);
-ms-transform:rotate(-180deg);
-moz-transform:rotate(-180deg);
-webkit-transform:rotate(-180deg);
-o-transform:rotate(-180deg);
font-size: 0;
}
</style>
<div class="comment"></div>
即可实现，使用伪类元素实现三角形。
参考了网络很多资源，大漠的和旭神的网站有很多精讲的。
下载链接https://files.cnblogs.com/files/leshao/%E5%8D%95%E6%A0%87%E7%AD%BE%E5%AE%9E%E7%8E%B0%E4%B8%89%E8%A7%92%E6%B0%94%E6%B3%A1.rar
