[实用技巧] 在ie7及以上浏览器上显示正常的css在ie6下显示不正常

[复制链接]
小新的微笑 2013-11-18 00:07:18
以下css在ie7及以上版本浏览器中显示的是一个空行,但在ie6下显示的却是一条粗的虚线。怎样让在ie6显示的效果也和ie7一样呢:#abcline { border-top:6px dashed #7BD676;border-color:transparent;border-left:0px solid #7BD676; border-right:0px solid #7BD676; border-bottom:0px solid #7BD676;width:960px;height:0px;}
而且还有一个严重的问题是:在ie6下,border-top:6px被显示的空行高度,远远大于6px。
1、IE6是不支持border的transparent属性的,所以只能用IE的虑镜去实现
2、如果你的把其它边框宽度设成0了,还不如不设定它(默认边框为none),搞得那么多无用代码出来
经过简化后的代码为:#abcline{width:960px;height:0;border-top:6px dashed transparent;filter :Chroma( color= #000000) ; }
border里加transparent是对IE6以外的浏览器设置的,后面的filter是针对IE的虑镜(可解决IE的问题),前面加分号;是因为border-top属性结束符号
针对你的补充:
如果只是想获得一个空行效果,那不必那么麻烦可以用以下方法实现:
1、margin-top:6px结元素顶部加个6px的空间;
2、加个,然后CSS
#abcline{height:6px;overflow:hidden;font-size:0;line-height:0;/*for IE6*/}
闻人逸致 2013-11-18 10:15:36
珍爱生命,果断回帖。
回复

使用道具 举报

巴妍 2013-11-22 10:30:34
支持你哈...................................
回复

使用道具 举报

卫梓琬 2013-11-27 22:06:26
在撸一遍。。。
回复

使用道具 举报

乐正茹薇 2013-11-29 20:40:02
我也是坐沙发的
回复

使用道具 举报

酆俊雅 2014-3-12 07:33:57
LZ是天才,坚定完毕
回复

使用道具 举报

单于力 2014-3-18 16:21:04
撸过
回复

使用道具 举报

石依云 2014-3-21 16:09:44
我是个凑数的。。。
回复

使用道具 举报

欧阳彦芝 2014-3-24 12:33:10
回复

使用道具 举报

淳于芷秋 2014-3-26 11:05:14
秀起来~
回复

使用道具 举报

鱼柔妙 2014-4-2 08:02:21
啊啊啊啊啊啊啊啊啊啊啊
回复

使用道具 举报

陶云溪 2024-12-31 18:30:33
前排支持下
回复

使用道具 举报

通菁英 2025-3-8 14:07:27
大人,此事必有蹊跷!
回复

使用道具 举报

梁飞雪 2025-4-2 10:36:16
元芳你怎么看?
回复

使用道具 举报

戴柔静 2025-4-4 18:21:04
是爷们的娘们的都帮顶!大力支持
回复

使用道具 举报

刘吉帆 2025-4-8 21:34:17
珍爱生命,果断回帖。
回复

使用道具 举报

郦幻香 2025-4-10 18:09:26 来自手机
好,很好,非常好!
回复

使用道具 举报

卫梦云 2025-5-19 18:41:29
顶起出售广告位
回复

使用道具 举报

元慕旋 2025-5-21 21:04:49
前排,哇咔咔
回复

使用道具 举报

於秋芳 2025-5-24 09:28:34
支持,赞一个
回复

使用道具 举报

手机版

GMT+8, 2025-6-1 23:24

Copyright © 2012 技术派 | 技术支持:技术派设计

Powered by Discuz! X3.4