用css实现三角形

.tri_left {
position: absolute;
left: -7px;
width: 0;
height: 0;
border-top: 7px solid transparent;
border-right: 7px solid #9db5f4;
border-bottom: 7px solid transparent;
}

.tri_right {
position: absolute;
right: -7px;
width: 0;
height: 0;
border-top: 7px solid transparent;
border-left: 7px solid #9db5f4;
border-bottom: 7px solid transparent;
}

.tri_bottom {
position: absolute;
bottom: -7px;
width: 0;
height: 0;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-top: 7px solid #9db5f4;
}

.tri_top {
position: absolute;
top: -7px;
width: 0;
height: 0;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-bottom: 7px solid #9db5f4;
}