纯CSS设计倒三角的原理！！

今天看切图教程时发现一个有趣的设计，即三角形，之前接触的都是矩形，三角形我们该怎么设计的。

首先我们需要知道的是，CSS中矩形边相交的地方都有一个突出的棱角，知道了这点，原理则不难解释。

 

当我们把div的宽高都设置为0时，那么就只剩下了边框，通过设置边框的厚度和颜色，我们就可以来设置各种三角形。

可以仔细考虑上面这个效果的实现代码，如下：

参考自：http://www.5imoban.net/jiaocheng/div+css/201602251590.html