上一篇文章我們說了如何利用element做一個折疊面板，細心的朋友有沒有發(fā)現(xiàn)，下面的樣式中右上角有一個三角形，其實css的三角形很好畫，有的公司甚至還會把畫一個三角形當做面試題，屬實是一個冷門又重要的知識，這里來記錄一下。
最簡單的其實就是用邊框border來做一個三角形，給定一個寬度和高度都為 0 的元素，其 border 的任何值都會直接相交，我們可以利用這個交點來創(chuàng)建三角形。也就是說，border屬性是三角形組成的。只要我們設(shè)置其他三個邊的顏色為透明，就能得到一個三角形。
這樣我們就得到了一個三角形，至于為什么要用transform：rotate(45deg)來旋轉(zhuǎn)一下，這里是因為用的是底邊，而設(shè)計圖需要一個朝向右上角的三角形。這樣通過旋轉(zhuǎn)我們得到了想要的三角形，在通過定位把三角形移動到右上角，這里有個小技巧，我們可以設(shè)置整個大div為overflow：hidden，然后定位的時候可以稍微超出一點，這樣尖銳的三角被隱藏，我們就得到了一個頭部有弧度的三角形。
