利用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; }
效果如下:
以上就是本文的全部内容了,希望大家能够喜欢。
【相关教程推荐】
1. CSS视频教程
2. CSS在线手册
3. bootstrap教程
声明:本文转载于:博客园,如有侵犯,请联系admin@php.cn删除