日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁 > 前端技术 > CSS >内容正文

CSS

css中光标的设置,CSS Cursors(光标)

發(fā)布時(shí)間:2025/3/21 CSS 63 豆豆
生活随笔 收集整理的這篇文章主要介紹了 css中光标的设置,CSS Cursors(光标) 小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

CSS Cursors(光標(biāo))

CSS光標(biāo)屬性,用于在鼠標(biāo)移至某個(gè)區(qū)域或網(wǎng)頁上的鏈接時(shí)定義光標(biāo)類型(即鼠標(biāo)指針)。

改變光標(biāo)的外觀

瀏覽器通常將鼠標(biāo)指針顯示在網(wǎng)頁的任何空白部分上,帶手套的手顯示在任何鏈接或可單擊的項(xiàng)目上,將編輯光標(biāo)顯示在任何文本或文本字段上。使用CSS,您可以重新定義這些屬性以顯示各種不同的光標(biāo)。

示例h1?{

cursor:?move;

}

p?{

cursor:?text;

}測試看看?/?

下表演示了大多數(shù)瀏覽器將接受的不同光標(biāo)。將鼠標(biāo)指針放在輸出列中的“ TEST”鏈接上,以顯示該光標(biāo)。

查看值示例查看

defaulta:hover{cursor:default;}

pointera:hover{cursor:pointer;}

texta:hover{cursor:text;}

waita:hover{cursor:wait;}

helpa:hover{cursor:help;}

progressa:hover{cursor:progress;}

crosshaira:hover{cursor:crosshair;}

movea:hover{cursor:move;}

url()a:hover{cursor:url("custom.cur"), default;}

創(chuàng)建自定義光標(biāo)

也可以具有完全自定義的光標(biāo)。

cursor屬性處理用戶定義的光標(biāo)值的逗號(hào)分隔列表,后跟通用光標(biāo)。如果第一個(gè)光標(biāo)指定不正確或找不到,則將使用逗號(hào)分隔列表中的下一個(gè)光標(biāo),依此類推,直到找到可用的光標(biāo)為止。

如果沒有用戶定義的光標(biāo)有效或不受瀏覽器支持,則將使用列表末尾的通用光標(biāo)。

提示:可以用于光標(biāo)的標(biāo)準(zhǔn)格式是該.cur格式。但是,您可以使用在線免費(fèi)提供的圖像轉(zhuǎn)換器軟件將諸如.jpg和的圖像轉(zhuǎn)換.gif為.cur格式。

示例a?{

cursor:?url("custom.gif"),?url("custom.cur"),?default;

}測試看看?/?

在上面的示例中custom.gif,custom.cur是自定義光標(biāo)文件,已上傳到您的服務(wù)器空間,并且default是通用光標(biāo),如果自定義光標(biāo)丟失或查看器的瀏覽器不支持它,則將使用該通用光標(biāo)。

警告:如果要聲明自定義光標(biāo),則必須在列表末尾定義一個(gè)通用光標(biāo),否則該自定義光標(biāo)將無法正確呈現(xiàn)。

這是自定義光標(biāo)的現(xiàn)場演示。

注意: IE9和更早版本僅支持.cur靜態(tài)光標(biāo)和.ani動(dòng)畫光標(biāo)的URL值。然而,瀏覽器如Firefox,Chrome和Safari瀏覽器有支持的.cur,.png,.gif和.jpg,但不會(huì).ani。

總結(jié)

以上是生活随笔為你收集整理的css中光标的设置,CSS Cursors(光标)的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。