hasLayout为
true设置
{display:inline-block}的元素的
hasLayout为
true设置
{height:xx}或
{width:xx}的元素必须具体以下两个条件之一,其
hasLayout才能为
true:IE8兼容模式和IE8以前的浏览器中,在标准(strict)模式下其
display的值是
block,如demo3就不行。元素在怪癖模式(compat mode)下。
设置了
{zoom:xx}的元素在IE8的兼容模式或IE8之前的浏览器中其
hasLayout为
true,但在IE8的标准模式下则不会触发
hasLayout。设置了
{writing-mode:tb-rl}的元素的
hasLayout为
true。元素的
contentEditable的属性值为
true。在IE8标准模式下设置了
{display:block}的元素的
hasLayout一直为
true,如demo8。 关于hasLayout的更多详情可以看Exploring Internet Explorer “HasLayout” Overview和On having layout
从上面就可以看出IE实现HTML元素的透明如此混乱,为了向下兼容和自己的私有属性让IE上实现元素透明有多种方式,比如CSS Opacity实例中的demo1到demo8,虽然IE 团队推荐实现透明的方式是:
复制代码
{
-ms-filter: “progid:DXImageTransform.Microsoft.Alpha(Opacity=50)”;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
opacity: .5;
}
而目前简单最好用的实现方式是如CSS Opacity中demo4这样:
复制代码
{
filter:alpha(opacity=30);
opacity:.3;
}
实际上目前最流行的JavaScript框架的设置样式方法都是应用这种方式,并且针对IE设置了
{zoom:1}来让元素的
hasLayout为
true,但在IE8的标准模式下
zoom并不能触发
hasLayout,所以利用它们设置










