也谈谈罪恶的Haslayout haslayout解决之道

(编辑:jimmy 日期: 2024/11/1 浏览:2)

什么是Haslayout?
    顾名思义,它的意思就是 --- has layout,是IE下的特有属性,通过 IE Developer Toolbar 可以查看 IE 下 HTML元素是否拥有haslayout,在 IE Developer Toolbar 下,拥有 haslayout的元素,通常显示为“haslayout = -1”。

hasLayout是一种只读属性,有两种状态 true/false,当其为true时,代表该元素有自己的布局,否则代表该元素的布局继承于父元素。

什么时候表明Haslayout = false?

    IE浏览器下的很多bug都是haslayout = false 引起的,所以出现下列问题,就很可能是haslayout跑出来捣鬼了。
      1.文字消失,截断
      2.边框消失
      3.3像素偏差
      4.绝对元素定位错误
      5.滤镜不生效
      6.滚动页面跳动
      7其他(欢迎补充哦~)
haslayout = true?
  haslayout是一种只读属性,不能人为设置,那该肿么办呢?
首先,IE下 有一些元素是默认带着 haslayout属性的:
   <table>
   <td>
   <body>
   <img>
   <hr>
   <input>
   <select>
   <textarea>
   <button>
   <iframe>
   <embed>
   <object>
   <applet>
   <marquee>
其他的就只能通过设置css 属性来触发haslayout = true,注意哦,haslayout = true一旦触发是不可逆转的~
触发的css 目前总结有:(欢迎补充哦)
1.position:absolute
2.float:left/right
3.display:inline-block
4.width,height:除“auto”外的任意值
5.zoom:除"normal"外 ...
and so on