HTML代码
<div class="div">
<div class="left">
</div>
<div class="right">
</div>
</div>
div定位
.div{
position: relative;
width: 100%;
height: 200px;
}
左向箭头
.left:before {
content: '';
position: absolute;
width: 0;
height: 0;
top: 30px;
border: 10px solid;
border-width: 9px 10px 9px 0;
border-color: transparent #d00;
}
右向箭头
.right:before {
content: '';
position: absolute;
width: 0;
height: 0;
border: 10px solid;
border-width: 9px 0 9px 10px;
border-color: transparent #cae7de;
}
效果
image.png
