CSS 游標一覽
CSS 的 cursor 可指定的游標全 36 種類用滑鼠懸停確認並複製代碼
特點
cursor 全 36 種一覽表顯示
CSS 標準關鍵字整理在一頁中刊載
滑鼠懸停即時確認實物
移動滑鼠游標將改變成該形狀
依用途 6 組分類整理
附帶簡短說明輕鬆找到所需游標
CSS 一鍵複製
「cursor: pointer;」的形式可直接貼上
使用方式
1
從群組中搜尋
從「一般」「拖曳與放置」等依用途分類的標題中搜尋候選項目
2
移動滑鼠確認
將游標懸停在「將滑鼠移至此處」的方框確認形狀
3
複製並貼上
透過「複製」按鈕取得 CSS 並貼到自己的樣式表
使用案例
按鈕和連結的游標確認
確認可點擊元素附加的 pointer 外觀
拖曳操作 UI 的游標選擇
比較 grab、move、copy 選擇適合排序或移動操作的形狀
無效和處理中表現的差異使用
確認 not-allowed、wait、progress 的差異並正確使用
CSS 學習中的值記憶
一次看到 cursor 可寫入的值種類和含義並記憶
基礎知識
pointer 和 default 的差異
pointer 是指尖形的游標，用於表示連結或按鈕等可點擊元素。default 是環境標準的箭頭游標，基本上用在按下後沒有任何反應的文字或背景上。
cursor 初期值 auto 的動作
cursor 屬性的初期值是 auto，瀏覽器會根據位置自動選擇游標形狀，在文字上如同 text，其他地方則如同 default。
指定 cursor 卻不改變的原因
指定 cursor 但游標形狀未改變時，通常是因為有其他元素重疊在上方，或是有其他規則覆蓋了指定。
- 上方重疊的元素：透明元素或虛擬元素重疊在上方時，游標形狀會遵循最上層元素的 cursor 指定顯示。
- 詳細度的覆蓋：同一元素套用多個規則時，詳細度（選擇符的強度）較高的規則之 cursor 指定優先適用。
- OS 和瀏覽器的差異：游標的圖案使用 OS 或瀏覽器提供的圖案，同樣的值在 Windows 和 macOS 上形狀不同。
安全性和隱私
瀏覽器內完成
輸入的資料僅在您的瀏覽器內處理，不會傳送到外部。
僅在瀏覽器內處理
游標顯示和代碼複製完全在您的瀏覽器內進行，輸入資料不會傳送到伺服器。
通訊透過HTTPS加密
頁面載入也透過TLS加密，第三者無法讀取內容。
不傳送給第三方
輸入內容不會傳送給廣告網路、追蹤器等外部服務。
結果不自動保存
複製的代碼和輸入建議不會保存在伺服器上。
在 Google 搜尋中追蹤 RAKKOTOOLS
189個實用工具，透過 Google 搜尋、AI 搜尋更容易找到！
- 搜尋中找到
- AI 搜尋也會顯示
- 發現新工具
更新資訊
- update #318
新增 CSS 游標列表，懸停查看並複製所有游標種類