码迷,mamicode.com
首页 > Web开发 > 详细

css 制作三角形图标 不支持IE6

时间:2014-08-18 16:10:32      阅读:195      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   2014   div   代码   log   

.triangle {
width: 10px;
height: 10px;
overflow: hidden;
border-left: 4px solid rgba(0, 224, 255, 1);
border-right: 4px solid rgb(0, 255, 10);
border-top: 4px solid #ff0;
border-bottom: 4px solid #ca0309;
}

效果:bubuko.com,布布扣

把10px改成0后:bubuko.com,布布扣

去掉border-top这一句:bubuko.com,布布扣

把border-left和border-right弄透明:bubuko.com,布布扣

修改后的代码:

.triangle {
width: 0;
height: 0;
overflow: hidden;
border-left: 4px solid rgba(0, 224, 255, 0);
border-right: 4px solid rgba(0, 255, 10, 0);
border-bottom: 4px solid #ca0309;
}

 

css 制作三角形图标 不支持IE6,布布扣,bubuko.com

css 制作三角形图标 不支持IE6

标签:style   blog   http   color   2014   div   代码   log   

原文地址:http://www.cnblogs.com/vincent_ds/p/3919642.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!