使用css绘制简单图形

先看代码跟效果

demo1：

    代码

    效果

demo2：

    代码

    效果：

    原理其实就是利用盒子的均分原理。盒子都是矩形或者正方形，从形状的中心，向4个方向（上右下左的顺序）划分4个部分。首先要保证元素是块级元素。当元素的width、height都为0时，则border的大小则为实际显示的大小（如效果一）。不需要显示的边框使用透明色transparent（如效果二）。

    其他情况就不一一列举了。