码迷,mamicode.com
首页 > 其他好文 > 详细

小结IE6的坑

时间:2016-03-07 17:00:02      阅读:227      评论:0      收藏:0      [点我收藏+]

标签:

1、z-index在position:relative/absolute等定位属性设置后还是无效,会导致top栏的导航栏目的子菜单被下面的层遮住,无法显示;
解决办法:?http://www.wufangbo.com/ie6-ie7-z-index-bug/
就是被子导航列表覆盖的层绝对不能设置为相对定位(在该层中想让其子元素设置为position:absolute;本层设置为position:relative;这样的组合在IE6中是绝对不允许的,解决办法是:去掉父层的position:relative;这个属性,修改其子元素定位为position:relative;即可,这样其父层就不会覆盖子导航列表了)


2、IE6对display:inline-block;属性支持的不全面,对内联元素支持的还可以,但对块状元素这样设置是无效的;
解决办法:
1、display:inline-block; _zoom:1;_display:inline;这样写才行。
2、将要弄成块状内联元素的div等标签换成内联元素span等,给span  display:inline-block;就行了。


3、IE6对png24图片的透明度支持的不好,只对png8的图片才支持其透明度,但是png8的图片品质太低,如果是文本的话
会出现边框锯齿,使得文本图片变得很难看;
解决办法:
用带背景的jgp图片代替,背景要与所在容器的背景一致即可。


4、IE6不支持圆角,圆角要用图片来表现出来,写样式时很麻烦,注意这个问题。


5、IE6不支持box-shadow这个阴影属性,要做阴影效果必须用滤镜,写法是:
box-shadow: 0px 2px 2px #BEBEBE;//这是标准浏览器css3的写法,下面是针对IE6的滤镜写法
filter:progid:DXImageTransform.Microsoft.Shadow(Strength=2,Direction=135,Color=‘#999999‘);
注意:color属性千万不能写成#999,一定要写全,否则会导致阴影跑到左上角去。

6、IE6中的select框的边框总是保留默认蓝色,无法去除,且其边框也不能简单的用border:0;或border:none;去除
解决办法是:
在select框外包含一层div,去除select边框即可,div的边框颜色是可以设置的。
具体解决代码是:
□、先给select加一个div父包含块,设置这个父包含块边框颜色为你想要的颜色,如:border: 1px solid #d0dad8;再加上overflow:hidden;属性;表示溢出部分隐藏,其作用原理是:让select偏移-1px的距离,一旦偏移就会触发overflow:hidden;属性,使得select边框被隐藏掉,解决了select边框无法被去除的问题;
□、接着,按照上面的原理,给select加上margin:-1px;属性,刷新,看到select边框被隐藏掉了,只剩下父层div的边框,看上去是那么回事了;
□、但是还有一个小尾巴,select默认的右边框还是蓝色的,且显示在没有溢出的div父层内,这时的解决办法是,增大select的宽度width为102%;表示比父层宽,原理也是宽出的部分会被隐藏掉,至此,就完成了兼容IE6以上的select边框的问题
□、最后,要注意的是别再表格单元格内使用以上效果,因为这么做会遮盖掉单元格td的右边框。

小结IE6的坑

标签:

原文地址:http://www.cnblogs.com/koleyang/p/5250878.html

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