CSS三角强化(边框的应用)

1.普通三角形

如何实现下述类似的三角形？

1. 宽、高个设置为0；
2. 给四个方向的边框设置不同的颜色；
3. 将其余方位的颜色设置为透明色（transparent ）；
   4.用定位调整在合适的位置。

2.直角三角形

下述类似效果如何实现？

1.只保留右边边框的颜色；
2.样式为solid；
3.上边框要大，和父元素一样高。右边框要小，其余边框均为0。
4.根据需要，用定位调整在合适位置。将颜色调整为需要的颜色。