use opaque div for ie6 only
I have a white/transparent logo in a transparent div which is on top of a picture. Problem is that with ie6, the transparent part of the logo becomes white and it just appears as a white square. Is there anyway to turn the div into black background when ie is being used开发者_StackOverflow中文版? I'm using mootools for JavaScript btw.
You can use an IE hack:
<!--[if lt IE 7]>
<style type='text/css'>
.some_div {
background: black;
}
</style>
<![endif]-->
This will affect all IE's less than IE 7
i think you can use conditional style sheet for ie6 only like this :
<!--[if IE 6]>
<link rel="stylesheet" href="YourStyle.css" type="text/css" media="all"/>
<![endif]-->
then the yorstyle.css file will contain css style for ie6 only
Here's a possible css solution:
div {
background:transparent url(transparent.png);
}
<!--[If IE 6]>
<style type=”text/css”>
#transparent {
background:#fff none;
filter:alpha(opacity=50);
height:1%;
}
#transparent * {
filter:alpha(opacity=100);
position:relative;
}
</style>
<![endif]-->
The other solution would be to stop supporting IE6 (my preference) ;)
from boilerplate:
<!--[if lt IE 7 ]> <html class="no-js ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]> <html class="no-js ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]> <html class="no-js ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
which affords in the SAME stylesheet to have even browser-specific rules w/o referencing multiple files, inline code and style tags which affect performance.
div.transparent {
opacity: .6;
}
.ie6 div.transparent {
filter:alpha(opacity=100);
background: black;
}
your problem sounds like it could be a png alpha issue as well though, depends.
http://www.dillerdesign.com/experiment/DD_belatedPNG/ is a pretty good fix, if you don't have element storage or events bound to the element.
加载中,请稍侯......
精彩评论