如何用css画出一个三角形
CSS还是蛮强大的，对于三角形这个在网页上不规则的形状，很多前端小朋友们直接切图了，这样的做法可谓是偷懒啦，下面咱们就体验下纯CSS是实现的三角形吧。各种角度，带你尝试下。
其实三角的实现就是用border来做的。
下面是步骤分析：
1、首先来看看给一个元素添加不同颜色的边框吧
说明：我们来看四条边框相交的角，这几条边框相交线并不是直角，而是一个倾斜的状态，其实这就是我们三角形形成的一个方法；继续往下看哦。
2、我们尝试着把一个元素的宽高设置为0；然后在添加上边框试试看效果。
说明：我们在盒模型中知道，边框始终是长在元素宽高之外的，很明显上图的效果就是用边框撑开的一个矩形，并且我们把注意点放在四条边框交汇的地方，不难发现其中的道理。
3、然后开始实现三角形了：
说明：transparent属性值代替之前的颜色值，当前的颜色为透明，这样就能写出下图的效果。（这是关键的一部）。
4、最后对应着想要实现那个方向的“三角形”就添加transparent属性值就OK了。
例：
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！