本文主要包含IE6,盒子模型等相关知识,佚名 希望在学习及工作中可以帮助到您
2010-8-18
去腾讯面试，问IE6。
前两天看的《IE6 很邪恶，但我爱它的盒子模型》，我说盒子模型如何如何，面试官告诉我IE5的盒子模型有问题，不是IE6。
回来查查书，《Web标准实战》上说了，是IE5/Win的盒子模型有问题。看来CSS还是不够精通。
特实验如下：
实验1：验证width、padding、border
渲染模式：标准模式
结论：标准模式时，IE6浏览器采用W3C盒子模型，此时IE6、Firefox表现一致。
代码：
渲染模式：标准模式
结论：标准模式时，IE6浏览器存在双倍margin的bug，此时IE6、Firefox表现不一致。
代码：
去腾讯面试，问IE6。
前两天看的《IE6 很邪恶，但我爱它的盒子模型》，我说盒子模型如何如何，面试官告诉我IE5的盒子模型有问题，不是IE6。
回来查查书，《Web标准实战》上说了，是IE5/Win的盒子模型有问题。看来CSS还是不够精通。
特实验如下：
实验1：验证width、padding、border
渲染模式：标准模式
结论：标准模式时，IE6浏览器采用W3C盒子模型，此时IE6、Firefox表现一致。
代码：
截图：
渲染模式：标准模式
结论：标准模式时，IE6浏览器存在双倍margin的bug，此时IE6、Firefox表现不一致。
代码：
截图：
把margin-left改为5px或更小，这时在IE6中表现正常了，说明的确是2倍margin了。
实验3：IE6 双倍边距出现的情况
渲染模式：标准模式
结论：IE6浏览器中，在一行之内，
第1个元素float:left产生双倍margin-left，第2个元素float:left，各个方向margin正常；
第1个元素float:left产生双倍margin-left，第2个元素float:right，各个方向margin正常；
第1个元素float:right产生双倍margin-right，第2个元素float:left产生双倍margin-left（这个让我很惊讶）；
上下margin正常。
代码：
<