CSS3中三角形及三角形组合图实现

    几何之三角形及三角形的组合图案理论

三角形( triangle ['traɪæŋɡl])能够当作正方形对角线交叉造成的图形

若想获得编号①方向向下三角形，只需对编号②③④三角形让其透明transparent；border-top设置须要显示颜色便可

若想获得编号②方向向左三角形，只需对编号①③④三角形让其透明transparent；border-right设置须要显示颜色便可

若想获得编号④方向向右三角形，只需对编号①②③三角形让其透明transparent；border-left设置须要显示颜色便可

若想获得编号③方向向上三角形，只需对编号①②④三角形让其透明transparent；border-bottom设置须要显示颜色便可 

若想获得编号①③三角形，只需对编号②④让其透明transparent便可

（以下图所示 ）

    HTML代码体现

    利用伪类:after实现矩形与三角形组合 优势代码简洁

    利用伪类实现较复杂组合

资料参考  http://www.cnblogs.com/zjneter/p/5652006.html