css3三角形兼容_纯css3绘制三角形

css3绘制三角形

div{

margin-bottom: 10px;

}

#SJX_UP{

width: 0px;

height: 0px;

overflow: hidden;

border-left: 20px solid transparent;

border-right: 20px solid transparent;

/*兼容IE6*/

_border-left: 20px solid #fff;

_border-right: 20px solid #fff;

border-bottom: 20px solid red;

}

#SJX_DOWN{

width: 0px;

height: 0px;

overflow: hidden;

border-left: 20px solid transparent;

border-right: 20px solid transparent;

border-top: 20px solid red;

}

#SJX_RIGHT{

width: 0px;

height: 0px;

overflow: hidden;

border-top: 20px solid transparent;

border-bottom: 20px solid transparent;

border-left: 20px solid red;

}

#SJX_LEFT{

width: 0px;

height: 0px;

overflow: hidden;

border-top: 20px solid transparent;

border-bottom: 20px solid transparent;

border-right: 20px solid red;

}

20px哪里可以自行调节大小