怎么用CSS修改鼠標(biāo)樣式

我們在DIV CSS布局時(shí)候，我們會(huì)遇到對對象內(nèi)鼠標(biāo)指針光標(biāo)進(jìn)行控制，比如鼠標(biāo)經(jīng)過指針變?yōu)槭种感螤畹葮邮?，接下來我們介紹鼠標(biāo)指針樣式cursor控制。系統(tǒng)默認(rèn)鼠標(biāo)指針樣式外，可以通過CSS設(shè)置圖片為鼠標(biāo)指針，常見有些網(wǎng)站鼠標(biāo)指針是各種各樣小圖片樣式，當(dāng)然這個(gè)是通過css cursor設(shè)置鼠標(biāo)樣式。

擴(kuò)展閱讀：css指針

一、cursor語法與結(jié)構(gòu)

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光標(biāo)說明

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è)置對象為圖片

2、cursor樣式效果圖

3、鼠標(biāo)指針說明

cursor設(shè)置或檢索在對象上移動(dòng)的鼠標(biāo)指針采用何種系統(tǒng)預(yù)定義的光標(biāo)形狀。

4、布局結(jié)構(gòu)

p { cursor: text; } /* css注釋： 設(shè)置鼠標(biāo)移動(dòng)到html p對象時(shí)鼠標(biāo)變?yōu)槲谋具x擇樣式 */

a { cursor: pointer; } /* css注釋： 設(shè)置鼠標(biāo)移動(dòng)到a超鏈接對象時(shí)鼠標(biāo)變?yōu)槭种感螤睿ㄦ溄舆x擇） */

body { cursor: url("小圖片地址")} /* 設(shè)置鼠標(biāo)指針默認(rèn)為一個(gè)小圖片 */。

常用的設(shè)置鼠標(biāo)樣式方法就是這么多，你學(xué)會(huì)了嗎？

相關(guān)閱讀：

用css實(shí)現(xiàn)css動(dòng)畫的暫停與播放功能教程

怎樣用CSS加粗字體

怎樣讓css圖片居中顯示

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com