关于画三角形的疑问

.flag>.five:before{

            content:"";

            position:absolute;

            left:-24px;

            top:4px;

            width:0;

            height:0;

            border-right:15px solid transparent;

            border-left:20px solid transparent;

            border-bottom:10px solid yellow;

            transform:rotate(300deg);

        }

代码是按照老师的指导写的，搞不懂为什么width和height要设为0,

还有最搞不懂的是为什么设置三个方向的border以后得到的是三个三角形