小編給大家分享一下在css中改變光標(biāo)樣式的方法，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
在css中cursor屬性是用來(lái)定義了鼠標(biāo)指針?lè)旁谝粋€(gè)元素邊界范圍內(nèi)時(shí)所用的光標(biāo)形狀；我們可以通cursor屬性來(lái)設(shè)置鼠標(biāo)光標(biāo)（指針）樣式。
cursor屬性的語(yǔ)法：
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)
可能的屬性值：
● url：需使用的自定義光標(biāo)的 URL。注：請(qǐng)?jiān)诖肆斜淼哪┒耸冀K定義一種普通的光標(biāo)，以防沒(méi)有由 URL 定義的可用光標(biāo)。
● default：默認(rèn)光標(biāo)（通常是一個(gè)箭頭）
● auto：默認(rèn)。瀏覽器設(shè)置的光標(biāo)。
● crosshair：光標(biāo)呈現(xiàn)為十字線。
● pointer：光標(biāo)呈現(xiàn)為指示鏈接的指針（一只手）
● move：此光標(biāo)指示某對(duì)象可被移動(dòng)。
● e-resize：此光標(biāo)指示矩形框的邊緣可被向右（東）移動(dòng)。
● ne-resize：此光標(biāo)指示矩形框的邊緣可被向上及向右移動(dòng)（北/東）。
● nw-resize：此光標(biāo)指示矩形框的邊緣可被向上及向左移動(dòng)（北/西）。
● n-resize：此光標(biāo)指示矩形框的邊緣可被向上（北）移動(dòng)。
● se-resize：此光標(biāo)指示矩形框的邊緣可被向下及向右移動(dòng)（南/東）。
● sw-resize：此光標(biāo)指示矩形框的邊緣可被向下及向左移動(dòng)（南/西）。
● s-resize：此光標(biāo)指示矩形框的邊緣可被向下移動(dòng)（北/西）。
● w-resize：此光標(biāo)指示矩形框的邊緣可被向左移動(dòng)（西）。
● text：此光標(biāo)指示文本。
● wait：此光標(biāo)指示程序正忙（通常是一只表或沙漏）。
● help：此光標(biāo)指示可用的幫助（通常是一個(gè)問(wèn)號(hào)或一個(gè)氣球）。
常用cursor光標(biāo)說(shuō)明
1、div{ cursor:default }默認(rèn)正常鼠標(biāo)指針
2、div{ cursor:hand }和div{ cursor:text }文本選擇效果
3、div{ cursor:move }移動(dòng)選擇效果
4、div{ cursor:pointer }手指形狀 鏈接選擇效果
5、div{ cursor:url(url圖片地址) }設(shè)置對(duì)象為圖片
cursor樣式效果圖
鼠標(biāo)指針說(shuō)明
cursor設(shè)置或檢索在對(duì)象上移動(dòng)的鼠標(biāo)指針采用何種系統(tǒng)預(yù)定義的光標(biāo)形狀。
控制設(shè)置鼠標(biāo)指針樣式是比較常用的，但光標(biāo)切記勿濫用，也不要輕易設(shè)置自定義圖片為鼠標(biāo)樣式這樣會(huì)將網(wǎng)頁(yè)造成復(fù)雜與不符合用戶體驗(yàn)感覺(jué)，切記光標(biāo)慎用。
以上是在css中改變光標(biāo)樣式的方法的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)網(wǎng)站制作公司行業(yè)資訊頻道！
重慶分公司
重慶分公司
