纯css绘制一个三角形

这是一个边框为 100px 的 div 

           <div class="sss">
           </div>

        .sss{
            width: 100px;
            height: 100px;
            border-width: 50px;
            border-style: solid;
            border-color: red blueviolet burlywood darkgoldenrod
        }

 

现在我把它的宽和高都设为 0 

        .sss{
            width: 0px;
            height: 0px;
            border-width: 50px;
            border-style: solid;
            border-color: red blueviolet burlywood darkgoldenrod
        }

再把它的左右和下边框的颜色都设成透明或和背景颜色相同的颜色

        .sss{
            width: 0px;
            height: 0px;
            border-width: 50px;
            border-style: solid;
            border-color: red transparent transparent transparent
        }