IE怪癖模式a：懸停式問題

我有一個跨度，我只想在光標懸停在它上面時顯示。要查看我期望的內容，請刪除「href」屬性並在非IE瀏覽器中嘗試使用它。IE怪癖模式a：懸停式問題

<!-- <!DOCTYPE html> --> 
<html> 

<head> 
    <style> 
     .container { 
      color: orange; 
     } 
     a.anchor { 
      text-decoration:none; 
      display: inline-block; 
      cursor: default; 
     } 
     a.anchor:hover span { 
      visibility: visible; 
     } 
     a.anchor span { 
      visibility: hidden; 
     }  
    </style> 
</head> 

<body> 
    <div class="container"> 
     <a class="anchor" href="#"> 
      <span>XXXXXXXXX</span> 
     </a> 
    </div> 
</body> 

</html>

請注意，doctype被註釋掉將IE放入怪癖模式。在這種模式下，除了錨點包含「href」屬性，IE a：hover無法與列出的CSS（可見性更改器）一起使用。

但是，通過添加「href」IE，瀏覽器將使用瀏覽器的默認錨點樣式覆蓋span的樣式。在我的應用程序，該div容器可以有動態的風格使得它很難過過寫錨的風格......

所以我的問題是：

1）我只能怪癖模式下工作。無論如何，我不需要使用href屬性就能以我想要的方式獲得懸停行爲嗎？

2）如果上一個問題的答案爲否，那麼刪除所有瀏覽器默認錨點樣式的最佳方法是什麼？

我真的希望不要爲此編寫腳本，但如果有任何腳本解決方案，請讓知道！

謝謝大家提前。

來源

2012-01-28 Viele

'button.onMouseOver =函數（）{的document.getElementById（「thespan」）的style.display = '內聯'。 }; button.onMouseOut = function（）{document.getElementById（「thespan」）。style.display ='none'; };' – Tim 2012-01-28 00:18:29

什麼是沒有href屬性的錨？通常你只會這樣做來標記頁面中的位置（帶有ID），這通常不會顯示。 – animuson 2012-01-28 00:19:55

嘗試將name屬性添加到您的'a'標籤。在HTML4中，標籤必須具有href或name屬性，所以我只能猜測你的'a'實際上只是作爲一個普通的'div'顯示，直到添加了所需的屬性。嘗試在您的樣式中添加'！important'並查看這是否足以覆蓋默認值。 – lpd 2012-01-28 00:22:16

嘗試

a.anchor:hover span { 
     display: inline-block; 
    } 
    a.anchor span { 
     display: none; 
    }

包括例如http://jsfiddle.net/gHKsY/4/

來源

2012-01-28 00:26:47

這不完全是我所需要的。當光標不在其上時，錨點必須完全不可見。 – Viele 2012-01-28 02:27:42

這很好，只需在背景上將背景設置爲透明：} – 2012-01-28 02:30:53

只使用顏色，以便測試。 – 2012-01-28 02:31:04

IE怪癖模式a：懸停式問題

回答

相關問題