有誰能詳細講一下css如何畫出一個三角形？

謝邀，下面講講我的思路！這是一個普通的 div ，一個邊長為 100px 的正方形，border 寬度為 10px， 沒有任何技術含量，地球人都會畫。

我們知道 border 是分為 top、right、bottom、left 的，那么這個矩形的四個邊是怎樣劃分的呢？

顯然，要想公平地分割四條邊框，只有這樣：

所以我們如果把上、左、右三條邊隱藏掉（顏色設為 transparent），會怎樣呢？吶，這就是個梯形了！感覺離革命勝利很近了是不是！仔細觀察一下這個梯形，和三角形有神馬區別呢？對！上面多了一條邊！上面這條邊有什么特點呢？

它的長度剛好等于 div 的寬度！

所以我們要把這個 div 的寬度縮小！多小合適呢？當然是 0 啦！

三角形粗來了！！！！！！！

好像太小了點，怎么把它放大捏？

很簡單，我們把 border 的寬度擴大，怎么擴大呢？顯然這條底邊和上邊已經沒什么關系了，上邊唯一的作用就是影響三角形頂點到 div 上邊緣的距離。所以我們只需要擴大左、下、右這三條邊。

下邊的 width 控制了三角形的高（150px）左右兩邊的 width 分別控制了三角形的底邊長的兩部分（加起來共 200px）

再舉個例子，如果把右邊 width 設為 0

就是個直角三角形了~

利用相鄰的兩個三角形還可以拼出鈍角三角形~

實現的方法還有很多，具體看你用哪種！