div实现网易云音乐评论的背景框
看到网易云音乐网页版的评论系统，它是用2个图标折叠显示出这种效果的
实现方式
- 三角的实现，使用
div设置border的方式创建三角形。 用2个三角形的覆盖，最外层的三角形颜色和文字框背景一样，确保只显示三角的边 - 主要用到
div的绝对定位，但是要确保是要相对于某个div的绝对定位，所以最外层<div class="wap">设置为position: relative;
<div class="wap">
<div class="main">
内容内容内容
</div>
<div class="arrow"></div>
<div class="sarrow"></div>
<div>
.wap{
position: relative;
width:300px // 最外层控制长宽
}
.main{
display:block;
border:1px solid red;
position:relative;
padding:10px;
background-color:#fff;
}
.arrow{
width: 0;
height: 0;
border-top: 5px solid transparent;
border-right: 5px solid red;
border-bottom: 5px solid transparent;
position: absolute;
top:7px;
left:-4.5px;
}
.sarrow{
width: 0;
height: 0;
border-top: 4.5px solid transparent;
border-right: 4.5px solid #fff;
border-bottom: 4.5px solid transparent;
position:absolute;
top:8px;
left:-3.5px;
}
