自訂CSS 遊標在Firefox 和Chrome 中不起作用
使用CSS 自訂遊標可以透過提供獨特且引人入勝的視覺回饋來增強使用者體驗。但是,確保跨瀏覽器相容性以避免差異至關重要。
在您的特定場景中,使用以下程式碼來建立自訂遊標:
<code class="css">body { cursor: url('http://anuary.com/dev/hp/pad3/public/images/hand-cursor.png'); }</code>
雖然此程式碼可能有效在某些瀏覽器中,它在Firefox 和Chrome 中遇到問題。根本原因不僅在於程式碼中缺少第二個參數,還在於影像本身的大小。
將影像調整為較小的比例,例如 32px,可以使自訂遊標正常運作。此外,考慮到圖像的外觀,建議指定“pointer”而不是“auto”。
<code class="css">cursor: url('http://anuary.com/dev/hp/pad3/public/images/hand-cursor.png'), pointer;</code>
注意:使用自訂遊標時不保持原始影像大小所有瀏覽器都支援。有關此限制的更多信息,請參閱 Mozilla 開發者網路有關遊標屬性的文檔。
以上是為什麼我的自訂 CSS 遊標無法在 Firefox 和 Chrome 中運作?的詳細內容。更多資訊請關注PHP中文網其他相關文章!