CSS-cursor屬性與用法總結

cursor 屬性規定要顯示的遊標的類型（形狀）。此屬性定義了滑鼠指標放在一個元素邊界範圍內時所使用的遊標形狀（不過 CSS2.1 並沒有定義由哪個邊界決定這個範圍）。

我們在DIV CSS佈局時候，我們會遇到對物件內滑鼠指標遊標進行控制，例如滑鼠經過指標變成手指形狀等樣式，接下來我們介紹滑鼠指標樣式cursor控制。系統預設滑鼠指針樣式外，可以透過CSS設定圖片為滑鼠指針，常見有些網站滑鼠指標是各種小圖片樣式，當然這個是透過css cursor設定滑鼠樣式。

1. CSS-cursor 屬性

cursor 屬性規定要顯示的遊標的類型（形狀）

#2. css cursor url用法格式詳解

css cursor url用法格式：css:{cursor:url('圖示路徑'),auto;} //IE,FF,chrome瀏覽器都可以

實例程式碼：

html{cursor: url("ued.taobao.com/blog/wp-content/themes/taobaoued/images/cursor.ico"),auto;}

解析：前面的url是自訂滑鼠圖示路徑，第2個參數auto是css標準的cursor樣式，可換成其它屬性(如pointer/default等)！

3. cursor 滑鼠樣式?

auto: 正常滑鼠

crosshair: 十字滑鼠

default: 預設滑鼠

pointer: 點狀滑鼠（hand,寫兩個是為了照顧IE5，它只認hand。）

move: 移動滑鼠

4. 關於cursor設置圖片問題

幾個要注意的地方：1.圖片位址為絕對路徑，2.圖片大小最好是32*32的大小，反正在各個瀏覽器下面解析的大小不一樣

5. css cursor 滑鼠形狀

url    需使用的自訂遊標的URL。

註解：請在此清單的末端始終定義一種普通的遊標，以防沒有由 URL 定義的可用遊標。

default    預設遊標（通常是箭頭）    

auto    預設。瀏覽器設定的遊標。    

crosshair    遊標呈現為十字線。    

pointer    遊標呈現為指示連結的指標（一手）    

move    此遊標指示某物件可移動。

6. 詳解CSS中cursor屬性實例程式碼

CSS之cursor屬性 

今天學習了CSS的cursor屬性，第一篇部落格就用來總結它吧。

cursor屬性用來控制遊標的顯示樣式，可選擇的值有這些：

cursor:url()*|
{auto|default|pointer|crosshair|text|vertical-text|help|not-allowed|no-drop|move|e-reszie|s-resize|w-resize|w-resize|n-resize|all-scroll|ne-resize|se-resize|nw-resize|sw-resize|col-resize|row-resize|}

*表示至少寫一個該值，url後面可再選{}內的一個值。

相關問答：

1. javascript - 給元素綁定了window.resize事件之後,之前設定的cursor屬性失效了.

2. vim - 映射視覺模式下的 實作 cursor 在split 視窗間的切換?

#【相關推薦】

1. php.cn獨孤九賤（2）－css視訊教學

2. 將滑鼠焦點定位到文字方塊最後

以上是CSS-cursor屬性與用法總結的詳細內容。更多資訊請關注PHP中文網其他相關文章！