CSS对IE6的兼容技巧

网站制作中CSS对浏览器的兼容很是重要，但是CSS对IE6的兼容确实非常挑剔，一般情况下CSS代码在IE6下是无法显示，根据W3C的标准，网站制作要用xhtml格式写代码，保定网络公司根据多年经验为您总结了一下CSS兼容技巧，为您提供：

　　　1、IE6下为什么图片下有空隙产生

　　解决这个BUG的技巧也有很多,可以是改变html的排版,或者设置img 为display:block 或者设置vertical-align 属性为vertical-align:top、bottom、middle、text-bottom 都可以解决.

　　2、IE与宽度和高度的问题

　　IE不认得min-这个定义，但实际上它把正常的width和height当作有min的情况来使。这样问题就大了，如果只用宽度和高度，正常的浏览器里这两个值就不会变，如果只用min-width和min-height的话，IE下面根本等于没有设置宽度和高度。

　　  3、DIV浮动IE文本产生3象素的bug

　　左边对象浮动，右边采用外补丁的左边距来定位，右边对象内的文本会离左边有3px的间距.

　　#box{ float:left; width:800px;}

　　#left{ float:left; width:50%;}

　　#right{ width:50%;}

　　*html #left{ margin-right:-3px; //这句是关键}

　
　　4、div的垂直居中问题

　　vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字，就垂直居中了。缺点是要控制内容不要换行

　　5、页面的最小宽度

　　min-width是个非常方便的CSS命令，它可以指定元素最小也不能小于某个宽度，这样就能保证排版一直正确。但IE不认得这个，而它实际上把 width当做最小宽度来使。为了让这一命令在IE上也能用，可以把一个放到标签下，然后为div指定一个类,然后CSS这样设计：

　　#container{ min-width: 600px; width:expression(document.body.clientWidth < 600? "600px": "auto" );}

　　第一个min-width是正常的;但第2行的width使用了Javascript，这只有IE才认得，这也会让你的HTML文档不太正规。它实际上通过Javascript的判断来实现最小宽度。

　　6、margin加倍的问题

　　设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。解决方案是在这个div里面加上display:inline;

　　7、如何对齐文本与文本输入框

　　加上 vertical-align:middle;

　　8、float的div闭合;清除浮动;自适应高度

　　<#div id=”floatA” ><#div id=”floatB” ><#div id=”NOTfloatC” >这里的NOTfloatC并不希望继续平移，而是希望往下排。

　　这段代码在IE中毫无问题，问题出在FF。原因是NOTfloatC并非float标签，必须将float标签闭合。在 <#div class=”floatB”> <#div class=”NOTfloatC”>之间加上 <#div class=”clear”>这个div一定要注意位置，而且必须与两个具有float属性的div同级，之间不能存在嵌套关系，否则会产生异常。并且将clear这种样式定义为为如下即可： .clear{ clear:both;}

　　作为外部wrapper的div 不要定死高度,为了让高度能自动适应，网站制作时要在wrapper里面加上overflow:hidden; 当包含float的box的时候，高度自动适应在IE下无效，这时候应该触发IE的layout私有属性用zoom:1;可以做到，这样就达到了兼容。