如何實現跨上下文CSS圖像遊標？

Question

我在這裏做錯了什麼，並會意識到糾正它的建議。

在CSS中使用cursor屬性與圖像url一起工作，但似乎無法使用默認上下文以外的任何其他工具。例如，當我將鼠標懸停在一個定位點上時，光標將轉換爲一般的OS指針遊標。

我希望能夠爲每個上下文定義不同的圖像url。這可能嗎？

在此先感謝。

P.S.我使用Chrome進行測試，但也需要跨瀏覽器。我也已經知道Opera不支持圖像遊標。

Answer 1

需要那麼通過使用div a:hover覆蓋默認的瀏覽器光標，通過靶向a元素

Demo

div, div a:hover { 
    cursor: url(http://investor.dragonwaveinc.com/common/images/briefcase-addv2.gif), auto; 
} 

，我們將覆蓋在hover

Answer 2

這一問題的默認指針光標是因爲當你將鼠標懸停在圖像上時，你實際上同時在超鏈接上懸停。誰的cursor屬性設置爲pointer。它覆蓋所有其他屬性設置到另一個。

因此，請嘗試編輯該超鏈接的類，以確保它適用於該圖像，並且所有其他超鏈接都具有默認光標。

是的，CSS是跨瀏覽器，所以你不會找到任何錯誤。

您可以檢查瀏覽器的開發者工具：

但是，如果你希望未來的支持，那麼你可以嘗試在開發工具（F12）的外觀和檢查其屬性被應用到元素，並將其一定會告訴你這一行。所以你可以檢查爲什麼一些CSS被應用，以及爲什麼一些CSS屬性在CSS中被覆蓋。