CSS样式写出三角形

CSS样式写出三角形的样式，在这里只举出两个例子，三角形朝上和三角形朝下，还有左上，左下，右上，右下。有需要或者感兴趣的可以自己调一下代码。调border的top、bottom、left、right的 transparent 或者#000。三个为一组，其中两个属性为transparent。另一个为#000或其他颜色。

1、简单的写一个div,用div的class名写出样式，transparent属性：定义个父元素颜色相同。

.triangle{
width:0;
height:0;
border-bottom:10px solid #000;
border-left:10px solid transparent;
border-right:10px solid transparent;
}

<div class="triangle"></div>

效果图：

2、

.triangle{
width:0;
height:0;
border-top:10px solid #000;
border-left:10px solid transparent;
border-right:10px solid transparent;
}

<div class="triangle"></div>

效果图：