第一步：新建一個div

<div class="san"></div>

第二步：根據(jù)三角形方向，為盒子添加樣式

1、向上

.san{width:0;height:0;border-right:100px solid transparent;border-left:100px solid transparent;border-bottom:100px solid red; }

2、向下

.san{width:0;height:0;border-right:100px solid transparent;border-left:100px solid transparent;border-top:100px solid red; }

3、向左

.san{width:0;height:0;border-top:100px solid transparent;border-bottom:100px solid transparent;border-right:100px solid red; }

4、向右

.san{width:0;height:0;border-top:100px solid transparent;border-bottom:100px solid transparent;border-left:100px solid red; }

over！

總結(jié)

以上是生活随笔為你收集整理的css3绘制三角形的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。