CSS绘制三角形

纯CSS绘制三角形，实现原理是将宽高设置为0，设置边框来形成三角形的样式。

首先我们绘制一个宽高为0，边框为30的DIV，并加以颜色区分

		.triangle {
			width: 0px;
			height: 0px;
			border-top: 30px solid chartreuse;
			border-left: 30px solid royalblue;
			border-right: 30px solid darkblue;
			border-bottom: 30px solid orangered;
		}

可以看出，宽高为0时边框是由三角形构成的

所以，当我们隐藏掉其他边框的时候，一个三角形就绘制出来了

		.triangle {
			width: 0px;
			height: 0px;
			border-top: 30px solid transparent;
			border-left: 30px solid transparent;
			border-right: 30px solid transparent;
			border-bottom: 30px solid orangered; /* 只显示下边框 */
		}