html代码：
<div class="tri"></div>
css:
.tri{
position: relative;
overflow: hidden;
background: linear-gradient(-40deg, #0b156f, #98214c);
background: -webkit-linear-gradient(-40deg, #0b156f, #98214c);
background: -moz-linear-gradient(-40deg, #0b156f, #98214c);
width: 80px;
height: 200px;
margin: 50px auto;
}
.tri:before,
.tri:after {
position: absolute;
content: '';
border-left: 40px solid transparent;
border-right: 40px solid transparent;
border-bottom: 200px solid #222;
}
.tri:before {
margin-left: -40px;
}
.tri:after {
margin-left: 40px;
}
