一、摘要
大多数在需要做个三角形图标时候，我们通常会选择用字体图标（确实方便省事），但是仅利用HTML+CSS，我们也可以写出一个漂亮的三角形。
二、核心原理
当一个盒子的width和height都为0时，加上border属性，此时正方形盒子就被分成了四个三角形（最长边就为盒子的四个边框)。此时把不需要的边的颜色设为透明，剩余边就会拼接成三角形。
三、代码示例
这里以向下的三角形为例：
<div class = "trangle-down"></div>
<style>
.trangle-down{
width:0;
height:0;
border-top:50px solid #333;
border-left:50px solid transparent;
border-right:50px solid transparent;
}
</style>
四、关键技巧
1.调整border宽度能改变三角形大小
2.想改方向，只保留对应方向border有颜色，其余透明
五、为什么border只写了三个边？
这是省略的写法，三角形方向对向的边，宽度为0px，索性直接省略不写。（写了容易变形，或者你也可以亲自实践试一下）
