在CSS中,關於滑鼠游標的設定主要透過cursor
屬性來實現。
以下是一些常見的滑鼠游標設定及其描述:
- 預設游標:
- 關鍵字:
default
- 描述:通常是箭頭形狀,是客戶端平臺的預設游標樣式。
- 自動游標:
- 關鍵字:
auto
- 描述:瀏覽器根據當前情況自動確定滑鼠游標型別。
- 手形游標:
- 關鍵字:
pointer
或hand
- 描述:豎起一隻手指的手形游標,通常用於指示超連結或可點選元素。
- 十字線游標:
- 關鍵字:
crosshair
- 描述:簡單的十字線游標,用於標示選擇或測量區域。
- 文字編輯游標:
- 關鍵字:
text
- 描述:用於標示可編輯的水平文字的游標,通常是大寫字母I的形狀。
- 移動游標:
- 關鍵字:
move
- 描述:十字箭頭游標,用於標示物件可被移動。
- 等待/忙碌游標:
- 關鍵字:
wait
- 描述:用於標示程式忙、使用者需要等待的游標,通常是沙漏或手錶的形狀。
- 幫助資訊游標:
- 關鍵字:
help
- 描述:帶有問號標記的箭頭,用於標示有幫助資訊存在。
- 禁止游標:
- 關鍵字:
not-allowed
- 描述:禁止標記(一個被斜線貫穿的圓圈)游標,用於標示請求的操作不允許被執行。
- 自定義游標:
- 關鍵字:
url(url)
- 描述:可以透過
url()
函式使用絕對或相對URL地址指定自定義游標檔案(字尾為.cur或.ani)。
此外,還有一些與調整矩形框邊緣相關的值,如: e-resize
、ne-resize
、nw-resize
、n-resize
、se-resize
、sw-resize
、s-resize
和w-resize
,這些值分別表示矩形框的邊緣可以向特定方向移動的游標。
偽類選擇器與滑鼠游標::hover
:用於選取滑鼠懸停在元素上時的樣式。:active
:用於選取滑鼠點選元素時的樣式。:focus
:用於選取具有焦點的元素。 這些偽類選擇器可以與cursor
屬性結合使用,以在滑鼠懸停、點選或元素具有焦點時改變游標的樣式。