只用css来实现各种三角形

简单点来说，就是通过border-color将某三个边设置为透明transparent来实现的：
注：transparent，就是透明的意思。
下面上代码：
HTML:

    <div id="a"></div>
    <div id="b"></div>
    <div id="c"></div>
    <div id="d"></div>

CSS:

#a {
    width: 0;
    height: 0;
    border: 80px solid;
    border-color: #0E90D2 transparent transparent transparent;
}
#b {
    width: 0;
    height: 0;
    border: 80px solid;
    border-color: transparent #0E90D2 transparent transparent;
}
#c {
    width: 0;
    height: 0;
    border: 80px solid;
    border-color: transparent transparent #0E90D2 transparent;
}
#d {
    width: 0;
    height: 0;
    border: 80px solid;
    border-color: transparent transparent transparent #0E90D2;
}

效果图：

css三角形.png