1, 关于图片
IE6只支持8位的PNG透明图片,所以,所有透明图片,需要转换成GIF格式的才能正常显示。
2,关于float以后的margin-left双倍问题
所有float:left后面,都要加上
display:inline;
3,float以后,撑开边框的方法
在float层的父层,加上:
#main-body:after {
content: "";
height: 0;
display: block;
clear: both;
}
如果上述方法无效的话,在float的层最后,加一个DIV层
<div style="clear:both"></div>
例如:
<div class="float-father">
<div class="float-left">......</div>
<div class="float-left">......</div>
<div style="clear:both"></div>
</div>
4, padding-left and margin-left感觉都失效的问题
使用之前,需要在父层定义:
text-align:left;
同样的,如果想要使用padding-right,父层也不许加上定义
text-align:right;
5,关于javascript:void(0)
估计写ajax,现在很多人都会用到这个,但是在IE6,在a标签的href属性中使用javascript:void(0),会导致一定的bug。
例如:gif格式的动态图片突然没反应了
解决方法:避免a标签与javascript:的混合使用。比如,可以用span标签和css代码伪装一个超链接
- a-link-span {
- color: #8d9393;/*使用定义的超链接颜色*/
- cursor: pointer;/*鼠标经过图层变成小手状*/
- }
6. DIV 的高度失效问题
因为IE6 默认的字体显示大小在12-14px之间,当DIV的高度小于这个值的时候,IE6就会自作聪明把数值调大= =+
解决方法是加一个font的值:
font-size: 0px;
7. font-size: 13px失效问题
IE6 不能识别这个,解决方法是换成font-size: 9pt
8. min-height的问题
IE6 不能识别min-height,但是当高度超过height值时,它会自动加高。解决方法是。另外需要注意的是,设置了min-height的话,父层的overflow不能设置成hidden
min-height: 300px;
height: auto !important;
height: 300px;
9. li 左边的小圆点有时候去不掉
IE 6下,彻底去掉list-style要用:
list-style: none outside none;
10. position fix失效的问题
IE 6下的做法是:
postion:absolute;
bottom:auto;
top:expression(eval(document.documentElement.scrollTop));
11. input相同size下,text和password宽度不同的问题
这个是由于字体问题引起的,解决方法:
input{font-family:'Verdana';}
12. :hover失效问题
IE 6下,只有a支持:hover。尽量避免在其它标签内使用hover,必须用的话,用动态修改class实现
13. position:absolute 绝对定位偏移的问题
这个问题最近头疼死我了……ORZ
要注意的有两点,一个是absolute的父层最好定义成relative。另一个是,left要定义成0。就是IE6 和IE7下,绝对定位要把上/下,左/右都定义了。
14.float的层会另起一行的问题。
这个问题也哭死我了……ORZ,特别是,当要用float:right的时候。
解决方法一:把float:right的层放在前面,但是这样有时会影响语意,我对代码有洁癖,不喜欢这方法= =
解决方法二:把float:right的前面一层设置成float:left。但是这样就要考虑撑开父层的方法,代码量也比较多。总之都很纠结= =。