如何在 CSS 中設定自訂遊標圖像，尤其是在 Firefox 中？

在CSS 中使用自訂遊標影像

您可能偶爾需要使用自訂遊標影像，例如放大網頁鏡，以實現特定目的上的元素。雖然這在許多瀏覽器中都可以輕鬆實現，但 Firefox 提出了獨特的挑戰。

設定自訂遊標的常見方法是透過 CSS。然而，不幸的是，使用者提供的程式碼 a.heroshot img {cursor:url(/img/magnify.cur),pointer;} 在 Firefox 中不起作用。

問題在於以下事實： macOS 上的 Firefox 不支援使用基於 URL 的遊標定義。要解決此問題，您可以使用-moz-zoom-in 關鍵字：

a.heroshot img {
  cursor: url(/img/magnify.cur), -moz-zoom-in, auto;
}

此更新的CSS 程式碼將在支援它的瀏覽器上顯示magnify.cur 圖像，Firefox 特定的縮放遊標將在Firefox 或系統預設遊標（如果兩者都不支援）。將應用程式瀏覽器識別的清單中的第一個遊標。

需要注意的是，您可以在線找到不同瀏覽器支援的遊標關鍵字列表，以確保跨平台的兼容性。

以上是如何在 CSS 中設定自訂遊標圖像，尤其是在 Firefox 中？的詳細內容。更多資訊請關注PHP中文網其他相關文章！