border小应用（三角形）

这次文章中将给大家介绍一个关于border的一个小应用，做出一个三角形

1.要做一个倒三角形。

css中的代码如下：

div{

    width: 0px;

    height: 0px;

    border-top: 100px solid red;

    border-bottom: 100px solid transparent;

    border-left: 100px solid transparent;

    border-right: 100px solid transparent;

}

html中的代码如下：

<div></div>   (这个小三角形是用border来实现的，里面不添加任何元素)

得到的效果如下：

通过其他三个方向的border颜色设置为透明来实现这个效果。

如果想要一个正三角，同理，除了下面的border外，其余颜色都设置为透明色。