解决ie6/7/8iframe背景透明的问题

时间 2020-01-01

原文原文链接

根据W3C CSS 2.1 规范规定，'background-color' 特性的默认值为 'transparent'，即透明；可是IE6/IE7/IE8中 BODY 元素的背景色不是 transparent，而是 #FFFFFF;html

在iframe中这个背景是其自己，不是iframe内的html元素的，因此，只对iframe进行相关设置就能去掉这个背景。ide

iframe有个allowTransparency的属性，意思是是否容许透明；可是IE6/IE7/IE8中倒是白色;因此咱们能够这样加上它 <iframe allowTransparency="true" />spa

若是为了追求更好的保障的话，就要加上iframe{ transparent;}< /p>orm

但还有一些特殊状况：有时候iframe不是HTML中自己写的，是加载进来的，这时虽然以上的CSS能够生效，但却无法给iframe自己加上allowTransparency属性了，这时候要怎么作？很简单htm

给它来一段js代码：ci

window.onload = function(){
    var ifra=document.getElementsByTagName('IFRAME');
    for(var i=0,l=ifra.length;i<l;i++) {
        ifra[i].setAttribute('allowTransparency','true');
    }
}

至此，觉得问题解决。可忽然发现仍是白色的背景，WHY?那是如前面说的IE6/IE7/IE8中 BODY 元素的背景色不是 transparent的，因此get

对iframe里的body也要设置透明化：transparent；iframe

在iframe中设置属性为
<iframe src="left.htm" scrolling="no" allowtransparency=true width="209" height="900" frameborder="0"></iframe>

在left.htm设置<body style="background-color:transparent">

若是不进行设置,则默认的背景色是白色.it