很多時候我們需要吧滑鼠遊標和頁面的元素結合互動,這樣能增加使用者體驗度,那我們需要怎麼用CSS設定滑鼠樣式呢?今天就帶給大家這份教學,怎麼用CSS來修改滑鼠樣式。
我們在DIV CSS佈局時候,我們會遇到對物件內滑鼠指標遊標進行控制,例如滑鼠經過指標變成手指形狀等樣式,接下來我們介紹滑鼠指標樣式cursor控制。系統預設滑鼠指針樣式外,可以透過CSS設定圖片為滑鼠指針,常見有些網站滑鼠指針是各種小圖片樣式,當然這個是透過css cursor設定滑鼠樣式。
延伸閱讀:css指標
一、cursor語法與結構
1、cursor語法:
cursor : auto | crosshair | default | hand | move | help | wait | text | w-resize |s-resize | n-resize |e-resize | ne-resize |sw-resize | se-resize | nw-resize |pointer | url (url)
常用cursor遊標說明
1)、div{ cursor:default }預設正常滑鼠指標
2)、div{ cursor:hand }和div{ cursor:text } 文字選擇效果
3)、div{ cursor:move } 移動選擇效果
4)、div{ cursor:pointer } 手指形狀連結選擇效果
##5)、div{ cursor :url(url圖片位址) }設定物件為圖片2、cursor樣式效果圖 #3、滑鼠指標說明 cursor設定或檢索在物件上移動的滑鼠指標採用何種系統預先定義的遊標形狀。 4、佈局結構p { cursor: text; } /* css註解: 設定滑鼠移動到html p物件時滑鼠變成文字選擇樣式*/
a { cursor: pointer; } /* css註解: 設定滑鼠移到abody { cursor: url("小圖片位址")} /* 設定滑鼠指標預設為一個小圖片*/。 常用的設定滑鼠樣式方法就是這麼多,你學會了嗎? 相關閱讀:以上是怎麼用CSS修改滑鼠樣式的詳細內容。更多資訊請關注PHP中文網其他相關文章!