用div+css制作三角形
2018-04-28 本文已影响0人
2c4419e9dafa
直角三角形为例:
右上角的三角形:
position: absolute;
right:0px;
top:0px;
width:0.5*$height;
height: 0.5*$height;
border-top: 60px solid red;
border-left: 60px solid transparent;
左上角的三角形
position: absolute;
left:0px;
top:0px;
width:0.5*$height;
height: 0.5*$height;
border-top: 60px solid red;
border-right: 60px solid transparent;
左下角的三角形
position: absolute;
left:0px;
bottom:0px;
width:0.5*$height;
height: 0.5*$height;
border-bottom: 60px solid red;
border-right: 60px solid transparent;
右下角的三角形
position: absolute;
right:0px;
bottom:0px;
width:0.5*$height;
height: 0.5*$height;
border-bottom: 60px solid red;
border-left: 60px solid transparent;