{
width: 0;
height: 0;
boeder-top: 40px solid transparent;
boeder-left: 40px solid #ff0000;
boeder-right: 40px solid transparent;
boeder-bottom: 40px solid transparent;
}
{
width: 0;
height: 0;
boeder-top: 40px solid #000;
boeder-left: 40px solid #ff0000;
boeder-right: 40px solid #ff0000;
boeder-bottom: 40px solid #000;
}
通过以上代码对比,我们可以知道,由于这个元素没有宽高,只有边框的线的宽度,所以会出现以上效果,每个三角形都是这个元素的边。而transparent意为透明的,所以说,我们想要哪一块三角形,只要把其他的三条边设置为透明即可。