haslayout 问题的调试与解决

haslayout 问题的调试与解决

　 　当网页在 IE 中有异常表现时，可以尝试激发 haslayout 来看看是不是问题所在。常用的方法是给某元素 css 设定 zoom:1。使用 zoom:1 是因为大多数情况下，它能在不影响现有环境的条件下激发元素的 haslayout。而一旦问题消失，那基本上就可以判断是haslayout 的原因。然后就可以通过设定相应的 css 属性来对这个问题进行修正了。建议首先要考虑的是设定元素的width/height 属性，其次再考虑其他属性。

　 　对 IE6 及更早版本来说，常用的方法被称为霍莉破解(Holly hack)，即设定这个元素的高度为 1%(height:1%;)。需要注意的是，当这个元素的 overflow 属性被设置为 visible 时，这个方法就失效了。或者使用 IE的条件注释。

　　对 IE7 来说，最好的方法时设置元素的最小高度为 0 (min-height:0;)。

　　haslayout 问题引起的常见 bug

　　IE6 及更低版本的双空白边浮动 bug

　　bug 修复: display:inline;

　　IE5-6/win 的 3 像素偏移 bug

　　bug 修复: _height:1%;

　　IE6 的躲躲猫(peek-a-boo) bug

　　bug 修复: _height:1%;

　　需要注意的是，hasLayout属性是微软特有的过时属性，在IE8、IE9中，hasLayout属性已经被废弃。上文中的InternetExplorer都是指IE7、IE6及以下版本。