面试中被问到用css画三角形，内心一定很美，最简单的方法：
div { width: 0； height: 0； border : 40px实体； 边框颜色： reddeepskyblueyellowyellowgreen； }
或者我们可以做得更完美
div { width: 0； height: 0； border : 40px实体； 边框颜色： transparenttransparentyellow； }
这样我们也能更完美地直接去除他的上面
div { width: 0； height: 0； border-top: 0px； border-right :100 pxsolidtransparent； border-bottom 3360100 pxsolidyellow； border-left :100 pxsolidtransparent； }
看起来没有什么区别，但确实很低…
我相信读这个博客的人通常都能做到这一步，但之前只是带大家去，接下来就是我想说的
首先提出问题：
div {width: 0； height: 0； 内容： '； border-left :100 pxsolidyellow； border-top :100 pxsolidyellow； 边框- bottom 3360100 pxsolidtransparent； }你认为这个代码应该画什么样的图形？
答案稍后再说。
我们先回去讨论吧。 为什么可以用border画三角形呢？
我们经常使用的是border :1 px固态红色； 有时，绘制红色的小边框，忽略边框是梯形而不是矩形
执行以下代码：
div {width: 80px； 高： 80px； border : 80px固态硬盘； border-color : pinkskyblueyellowyellowgreen； }显示的效果
知道这个之后，我们就不用再背画三角形了。
同时说两句闲话
1 .刚开始什么都不懂的时候，我试着直接写了画三角形的代码
border:50 pxsolidpinkskyblueyellowyellowgreen； border:1px solid red本以为这样也可以，但实际上完全没有显示。 我调查了一下为什么是这样。
w3c明确说明了border-color属性设置四个边框的颜色。
我只是对border进行了说明。 border是缩写属性，用于将四条边的属性设置为一个声明。
反正border不能直接设定四个边框的颜色。 虽然不是鸡蛋用的，但是大家也可以知道
2 .边框颜色设置也遵循一致的上下左右顺序。 (对于三种颜色，第二种颜色默认为左右颜色值。 这也是我们画第二个三角形时使用的。 ）
边框颜色：红色绿色蓝色；
上边框是红色的
右边框和左边框是绿色的
底线是蓝色的
顺便问一下，如果不对某个边框设置宽度，效果会怎么样呢？
div {width: 0； height: 0； 内容： '； border-left : 100 px固态硬盘； border-top :100 pxsolidyellow； 边框- bottom 3360100 pxsolidblue； }我最初想象的右边三角形不是少了一个，而是少了右半部，上边和下边也受到了影响
事实上，这个想也可以理解。 少了一条边是因为我们一直在研究角。 也许又理所当然地开始把它当成角来看了。 不认同的人请看中心不空的图。
然后可以知道我上面问题的答案
div {
width: 0；
height: 0；
内容：‘’；
border-left :100 pxsolidyellow；
border-top :100 pxsolidyellow；
边框- bottom 3360100 pxsolidtransparent；
}
因为没有右边，所以先变成长方形，因为下面是无色的，所以最终变成直角梯形。
如果有错误的话请多多指正