利用css寫三角形，兼容IE7

.arrow-up { width:0px; height:0px; border-left:10px solid transparent; border-right:10px solid transparent; border-bottom:10px solid red; font-size:0px; line-height:0px;margin: 0 auto;} .arrow-down { width:0px; height:0px; border-left:10px solid transparent; border-right:10px solid transparent; border-top:10px solid blue; font-size:0px; line-height:0px; } .arrow-left { width:0px; height:0px; border-bottom:10px solid transparent; border-top:10px solid transparent; border-right:10px solid #DC143C; font-size:0px; line-height:0px;} .arrow-right { width:0px; height:0px; border-bottom:10px solid transparent; border-top:10px solid transparent; border-left:10px solid #FF00FF; font-size:0px; line-height:0px; }

?

效果如下：

轉(zhuǎn)載于:https://www.cnblogs.com/qiye2016/p/5807323.html

總結(jié)

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

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