非常奇怪的IE7/8邊框/不透明度兼容性問題

奇怪的問題是，在IE/8/9中應用不透明度時邊框消失，而不是7！
我已經基本上得到了一個在屏幕頂部的標籤菜單。即：非常奇怪的IE7/8邊框/不透明度兼容性問題

<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); 
}

很抱歉的明星，我不能讓代碼塊格式化工作的權利。
基本上，這只是當鼠標懸停在他們身上時不應該按鈕，但邊界就會消失！這個問題只發生在IE8/9上，但在IE7，FF，Chrome，Safari上一切正常。
我已經瀏覽了互聯網尋找一些奇怪的IE8 +邊框/不透明問題，但似乎沒有任何。
有沒有人遇到類似的東西？

來源

2011-05-13 Eugene

我剛剛遇到了同樣的問題，我無言以對。 –

您是否爲您的表格單元格設置了背景顏色，因爲它似乎只在設置了背景顏色時纔會發生。 –

根據這個問題http://stackoverflow.com/questions/3465346/table-cell-loses-border-when-css-gradient-filter-is-applied-in-ie8表格邊框在IE8似乎有probelms甚至與其他過濾器 –

filter樣式適用於IE7及更低版本。

IE8要求您使用-ms-filter（即帶有供應商前綴）。另外在IE8中語法更復雜。它看起來像這樣：

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

IE9下降爲filter完全的支持，並與標準的CSS3 opacity，因爲它在所有其他browsrs做其工作原理相同替換它。

Quirksmode.org擁有的全部細節：http://www.quirksmode.org/css/opacity.html

來源

2011-05-25 17:36:23 Spudley

我不認爲這是使用IE8方式編寫過濾器的問題。在最壞的情況下錯誤的書面過濾器將不適用不透明度。問題在於表格單元格邊框消失。 –

filter：alpha（opacity = 100）; //它在0到100之間變化 – KBN

這是我發現的，到目前爲止，我不認爲你刪除表格單元格的background-color可能是您的解決方案。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <style type="text/css"> 
     table {border-top:1px solid #cccccc; border-left:1px solid #cccccc;} 
     table td {border-bottom:1px solid #cccccc; border-right:1px solid #cccccc; padding:3px;}  
     table tr.opaque td { 
     -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
     filter:alpha(opacity=100); opacity:1;} 

     /* By adding background-color below, the table borders cells disappears 
     in IE8. It's just the nth Microsoft's trigger tree! 
     IE7 does not have this issue. */ 
     table tr.opaque td {background-color:#ffffff;} 
    </style> 
</head> 
<body> 
<table border="0" cellpadding="0" cellspacing="0"> 
    <tr><td><p>column 1</p></td><td><p>column 2</p></td><td><p>column 3</p></td></tr> 
    <tr class="opaque"><td><p>column 1</p></td><td><p>column 2</p></td><td><p>column 3</p></td></tr> 
    <tr><td><p>column 1</p></td><td><p>column 2</p></td><td><p>column 3</p></td></tr> 
</table> 
</body> 
</html>

這是當背景顏色是上IE8應用美麗的結果：

enter image description here

來源

2011-05-25 18:14:44

我最終不得不求助於將背景顏色從td移動到td內的div（div必須略大於td以使其看起來無縫），同時保持不透明度並且在td上有邊框並且具有背景：在td上沒有; – Eugene

@Metatron：有趣的新的IE8黑客。我會嘗試你的解決方案並讓你知道。感謝分享這個想法。 –

非常奇怪的IE7/8邊框/不透明度兼容性問題

回答

相關問題