修改鼠標(biāo)樣式的CSS代碼
發(fā)布時(shí)間:2014-02-20 11:19:45 作者:佚名
我要評(píng)論

鼠標(biāo)的形狀主要有:手形、移動(dòng)、正在執(zhí)行、十字形等等,下面為大家介紹下如何修改鼠標(biāo)的CSS樣式
鼠標(biāo)的形狀主要有:
手形
移動(dòng)
正在執(zhí)行
十字形
文本編輯I
幫助
等待
文本編輯I
自動(dòng)(遇到文本變I,遇到鏈接變手形,遇到可擴(kuò)展邊緣變向各方向拉伸形狀……)
默認(rèn)(箭頭)
向右變形(東east)
向右上變形
向左上變形
向上變形(北north)
向右下變形
向左下變形
向下變形(南south)
向左變形(西western)
代碼:
<div style="cursor: pointer;">手形</div>
<div style="cursor: move;">移動(dòng)</div>
<div style="cursor: progress;">正在執(zhí)行</div>
<div style="cursor: crosshair;">十字形</div>
<div style="cursor: text;">文本編輯I</div>
<div style="cursor: help;">幫助</div>
<div style="cursor: wait;">等待</div>
<div style="cursor: inherit;">文本編輯I</div>
<div style="cursor: auto;">自動(dòng)(遇到文本變I,遇到鏈接變手形,遇到可擴(kuò)展邊緣變向各方向拉伸形狀……)</div>
<div style="cursor: default;">默認(rèn)(箭頭)</div>
<div style="cursor: e-resize;">向右變形(東east)</div>
<div style="cursor: ne-resize;">向右上變形</div>
<div style="cursor: nw-resize;">向左上變形</div>
<div style="cursor: n-resize;">向上變形(北north)</div>
<div style="cursor: se-resize;">向右下變形</div>
<div style="cursor: sw-resize;">向左下變形</div>
<div style="cursor: s-resize;">向下變形(南south)</div>
<div style="cursor: w-resize;">向左變形(西western)</div>
手形
移動(dòng)
正在執(zhí)行
十字形
文本編輯I
幫助
等待
文本編輯I
自動(dòng)(遇到文本變I,遇到鏈接變手形,遇到可擴(kuò)展邊緣變向各方向拉伸形狀……)
默認(rèn)(箭頭)
向右變形(東east)
向右上變形
向左上變形
向上變形(北north)
向右下變形
向左下變形
向下變形(南south)
向左變形(西western)
代碼:
復(fù)制代碼
代碼如下:<div style="cursor: pointer;">手形</div>
<div style="cursor: move;">移動(dòng)</div>
<div style="cursor: progress;">正在執(zhí)行</div>
<div style="cursor: crosshair;">十字形</div>
<div style="cursor: text;">文本編輯I</div>
<div style="cursor: help;">幫助</div>
<div style="cursor: wait;">等待</div>
<div style="cursor: inherit;">文本編輯I</div>
<div style="cursor: auto;">自動(dòng)(遇到文本變I,遇到鏈接變手形,遇到可擴(kuò)展邊緣變向各方向拉伸形狀……)</div>
<div style="cursor: default;">默認(rèn)(箭頭)</div>
<div style="cursor: e-resize;">向右變形(東east)</div>
<div style="cursor: ne-resize;">向右上變形</div>
<div style="cursor: nw-resize;">向左上變形</div>
<div style="cursor: n-resize;">向上變形(北north)</div>
<div style="cursor: se-resize;">向右下變形</div>
<div style="cursor: sw-resize;">向左下變形</div>
<div style="cursor: s-resize;">向下變形(南south)</div>
<div style="cursor: w-resize;">向左變形(西western)</div>
相關(guān)文章
- css實(shí)現(xiàn)的鼠標(biāo)經(jīng)過某對(duì)象時(shí)讓其變成手狀,下面整理了光標(biāo)的各種樣式,其中pointer, hand為手形光標(biāo)2014-07-22
CSS定義鼠標(biāo)經(jīng)過時(shí)鼠標(biāo)圖形的十五種樣式整理
鼠標(biāo)經(jīng)過時(shí)一般都會(huì)有鼠標(biāo)的圖形樣式,為了方便使用本文整理了十五種常見的鼠標(biāo)經(jīng)過樣式,喜歡的朋友可以收集下2013-09-10- CSS中cursor屬性的鼠標(biāo)樣式有哪些?本文整理了一些,可供大家使用,感興趣的朋友也可以參考下2013-09-09
- 鼠標(biāo)的顯示樣式可以在css里進(jìn)行友好的控制,下面整理了一些鼠標(biāo)的樣式類型,感興趣的朋友可以參考下,希望對(duì)大家學(xué)習(xí)css有所幫助2013-08-20
- 要用到鼠標(biāo)樣式效果,就順便整理了下十五種CSS鼠標(biāo)樣式,小例子供大家使用啊,下面與大家分享下CSS鼠標(biāo)樣式語法及示例,有需求的朋友可以參考下,希望對(duì)大家有所幫助2013-08-13
css鼠標(biāo)樣式cursor介紹(鼠標(biāo)手型)
巧合要用到鼠標(biāo)樣式效果,就順便整理了下十五種CSS 鼠標(biāo)樣式,小例子供大家使用啊2013-03-27css3實(shí)現(xiàn)信封動(dòng)態(tài)折疊留言樣式并響應(yīng)鼠標(biāo)
一個(gè)俏皮可愛的CSS實(shí)現(xiàn)的信封留言樣式,包含基本的留言內(nèi)容,效果很不錯(cuò),感興趣的你可以參考下2013-02-22CSS cursor 屬性 -- 鼠標(biāo)指針樣式效果
取值: [ [<uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resi2009-04-08巧妙運(yùn)用CSS立刻改變鼠標(biāo)的樣式-CSS教程-網(wǎng)頁制作-網(wǎng)頁教學(xué)網(wǎng)
用慣了Windows的人對(duì)各種各樣的鼠標(biāo)樣式一定不會(huì)陌生。當(dāng)鼠標(biāo)移動(dòng)到不同的地方時(shí),當(dāng)鼠標(biāo)執(zhí)行不同的功能時(shí),當(dāng)系統(tǒng)處于不同的狀態(tài)時(shí),都會(huì)使鼠標(biāo)的形狀發(fā)生變化。而在2008-10-17- 這篇文章主要介紹了CSS更改鼠標(biāo)為手狀樣式的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-07-20