border的大小的值為三角形底邊上的高，三角形的底為相鄰兩邊的border的高的和，如下圖所示的紅色銳角三角形
若想實現直角三角形的效果，如下圖所示直角在左上的三角形，按原理可設置上border和左border的顏色，另外兩條邊的顏色為transparent，此樣式可簡寫為只設置上border的顏色，另壹條相鄰的右border為transparent
妳也許會遇到要畫個奇怪三角形的時候，只要參考銳角三角形的方式，找到三角形底邊和高，計算出三角形高和把相鄰兩條邊的高相加作為底部，妳可以畫出各種各樣的三角形，如果再加上角度旋轉的css，妳便啥三角形都能畫！
此類三角形解決思路通常使用兩個不同顏色的三角形做顏色疊加，比如做如上圖所示的邊框為1px的紅色邊框白色底三角形，就先畫壹個紅色三角形，再畫壹個尺寸少2px的白色底三角形，然後設置兩個三角形的position將三角形重疊，這裏使用偽元素實現
1、向上正箭頭
2、向下正箭頭
3、向左正箭頭
4、向右正箭頭
5、向左上箭頭
6、向右上箭頭
7、向左下箭頭
8、向右下箭頭