极其奇怪的IE7 / 8边框/不透明兼容性问题 [英] Extremely weird IE7/8 border/opacity compatibility issue

问题描述

奇怪的问题是在IE / 8/9中应用不透明度时出现的边框，但在7中不是！

我基本上得到了一个带有在屏幕顶部的标签的菜单。
I.e：

 < table> 
< tr> 
< td class =tab>按钮1 ...< * / td> 
< td class =tab>按钮2 ....< * / td> 
。 
。 
。 
< / tr> 
< / table> 
 
< style> 
 td 
 {
 opacity：0.45; 
 filter：alpha（opacity = 45）; 
。 
。 
。 
} 
 td.tab:hover 
 {
 opacity：1; 
 filter：alpha（opacity = 100）; 
} 
  

对不起星星，我无法获得代码块格式化工作正常。

基本上，当鼠标悬停在按钮上时，它只是用来展开按钮，但是边框只是消失了！这个问题只发生在IE8 / 9，但一切工作正常在IE7，FF，Chrome，Safari。

我拖网网络寻找一些奇怪的IE8 +边框/不透明问题，但没有

有人遇到类似的问题吗？

解决方案

IE8需要使用 -ms-filter （即带有供应商前缀）。加上语法在IE8更复杂。它看起来像这样：

  -ms-filter：progid：DXImageTransform.Microsoft.Alpha（Opacity = 50）; 
  

IE9完全不支持过滤器用标准CSS3 opacity 替换它，它的工作方式与所有其他浏览器相同。

Quirksmode.org有完整的详细信息： http://www.quirksmode.org/css/opacity.html

The weird problem is borders dissapearing when Opacity is applied in IE/8/9, but NOT in 7!
I've basically got a menu with tabs on top of the screen. I.e:

<table>  
 <tr>  
  <td class="tab">button 1...<*/td>  
  <td class="tab">button 2....<*/td>  
  .  
  .  
  .  
 </tr>  
 </table>  

 <style>  
 td  
 {  
    opacity: 0.45;  
    filter:alpha(opacity=45);  
    .  
    .  
    .  
 }  
 td.tab:hover  
 {  
    opacity: 1;  
    filter:alpha(opacity=100);  
 }  

Sorry about the stars, I couldn't get the code block formatting working right.
Basically this is just supposed to unfade the buttons when the mouse is hovered over them, but the borders just disappear! This problem only occurs on IE8/9, but everything works fine on IE7,FF,Chrome,Safari.
I've trawled the internet looking for some weird IE8+ border/opacity issues, but there don't seem to be any.
Has anyone encountered something similar?

解决方案

The filter style is for IE7 and lower only.

IE8 requires you to use -ms-filter (ie with a vendor prefix) instead. Plus the syntax is more complex in IE8. It looks like this:

-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

IE9 drops support for filter entirely, and replaces it with standard CSS3 opacity, which works the same as it does in all other browsrs.

Quirksmode.org has the full details: http://www.quirksmode.org/css/opacity.html

这篇关于极其奇怪的IE7 / 8边框/不透明兼容性问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！