【CSS】-【如何用css实现一个三角形？】方法1：利用border属性方法2：利用CSS3的clip-path属性

方法1：利用border属性

.triangle{
    width: 0;
    height: 0;
    <!--只有上边框有颜色，其它为透明-->
    border-color: red transparent transparent transparent; 
    border-style: solid;
    border-width: 10px;
}

方法2：利用CSS3的clip-path属性

.triangle{
    width: 10px;
    height: 10px;
    background: red;
    <!--将坐标（0，0），（5，10），（10，0）连成一个三角形-->
    clip-path: polygon(0px 0px, 5px 10px, 10px 0px);
    <!--旋转180°，变成下三角-->
    transform: rotate(180deg);
}