css不能獲取光標(biāo)當(dāng)前的位置,但是css可以通過(guò)cursor屬性控制光標(biāo)的形態(tài),如:cursor:pointer;即表示光標(biāo)為指針形狀
成都創(chuàng)新互聯(lián)公司主要從事網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、網(wǎng)頁(yè)設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)射陽(yáng),10年網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專業(yè),歡迎來(lái)電咨詢建站服務(wù):18982081108
自定義光標(biāo)樣式,通過(guò)自定義光標(biāo)的圖案來(lái)設(shè)置光標(biāo)的長(zhǎng)短。
CSS里的cursor屬性能接受很多種光標(biāo)樣式屬性,而且,如果使用url()表達(dá)式,你還能用自己的圖片自定義光標(biāo)圖案樣式。
自定義光標(biāo)樣式的CSS代碼如下:
body?{
cursor:?url('some-cursor.ico'),?default;
}
css的cursor屬性是設(shè)置鼠標(biāo)樣式的。
以下是鼠標(biāo)樣式的幾種表現(xiàn)方式以及解釋:
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è)氣球)。
還有一種就是 url ,需要你自定義一個(gè)鼠標(biāo)樣式
屬性名: cursor
屬性值( 手勢(shì)狀態(tài) ):
auto : 默認(rèn)值。瀏覽器根據(jù)當(dāng)前情況自動(dòng)確定鼠標(biāo)光標(biāo)類型。
all-scroll : IE6.0 有上下左右四個(gè)箭頭,中間有一個(gè)圓點(diǎn)的光標(biāo)。用于標(biāo)示頁(yè)面可以向上下左右任何方向滾動(dòng)。
col-resize : IE6.0 有左右兩個(gè)箭頭,中間由豎線分隔開的光標(biāo)。用于標(biāo)示項(xiàng)目或標(biāo)題欄可以被水平改變尺寸。
crosshair : 簡(jiǎn)單的十字線光標(biāo)。
default : 客戶端平臺(tái)的默認(rèn)光標(biāo)。通常是一個(gè)箭頭。
hand : 豎起一只手指的手形光標(biāo)。就像通常用戶將光標(biāo)移到超鏈接上時(shí)那樣。
move : 十字箭頭光標(biāo)。用于標(biāo)示對(duì)象可被移動(dòng)。
help : 帶有問(wèn)號(hào)標(biāo)記的箭頭。用于標(biāo)示有幫助信息存在。
no-drop : IE6.0 帶有一個(gè)被斜線貫穿的圓圈的手形光標(biāo)。用于標(biāo)示被拖起的對(duì)象不允許在光標(biāo)的當(dāng)前位置被放下。
not-allowed : IE6.0 禁止標(biāo)記(一個(gè)被斜線貫穿的圓圈)光標(biāo)。用于標(biāo)示請(qǐng)求的操作不允許被執(zhí)行。
pointer : IE6.0 和 hand 一樣。豎起一只手指的手形光標(biāo)。就像通常用戶將光標(biāo)移到超鏈接上時(shí)那樣。
progress : IE6.0 帶有沙漏標(biāo)記的箭頭光標(biāo)。用于標(biāo)示一個(gè)進(jìn)程正在后臺(tái)運(yùn)行。
row-resize : IE6.0 有上下兩個(gè)箭頭,中間由橫線分隔開的光標(biāo)。用于標(biāo)示項(xiàng)目或標(biāo)題欄可以被垂直改變尺寸。
text : 用于標(biāo)示可編輯的水平文本的光標(biāo)。通常是大寫字母 I 的形狀。
vertical-text : IE6.0 用于標(biāo)示可編輯的垂直文本的光標(biāo)。通常是大寫字母 I 旋轉(zhuǎn)90度的形狀。
wait : 用于標(biāo)示程序忙用戶需要等待的光標(biāo)。通常是沙漏或手表的形狀。
*-resize : 用于標(biāo)示對(duì)象可被改變尺寸方向的箭頭光標(biāo)。 w-resize | s-resize | n-resize | e-resize | ne-resize | sw-resize | se-resize | nw-resize
url ( url ) : IE6.0 用戶自定義光標(biāo)。使用絕對(duì)或相對(duì) url 地址指定光標(biāo)文件(后綴為 .cur 或者 .ani )。
任意標(biāo)簽中插入 style="cursor:hand"
多種形狀可供選擇
hand是手型
pointer也是手型,這里推薦使用這種,因?yàn)檫@可以在多種瀏覽器下使用。
crosshair是十字型
text是移動(dòng)到文本上的那種效果
wait是等待的那種效果
default是默認(rèn)效果
help是問(wèn)號(hào)
e-resize是向右的箭頭
ne-resize是向右上的箭頭
n-resize是向上的箭頭
nw-resize是向左上的箭頭
w-resize是向左的箭頭
sw-resize是左下的箭頭
s-resize是向下的箭頭
se-resize是向右下的箭頭
auto是由系統(tǒng)自動(dòng)給出效果
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " "
html xmlns=" "
head
meta http-equiv="Content-Type" content="text/html; charset=gb2312" /
title光標(biāo)/title
style type="text/css"
!--html {cursor: crosshair;} --
/style
/headbody
/body
/html
新聞標(biāo)題:光標(biāo)樣式css,光標(biāo)樣式及使用濾鏡等屬性
當(dāng)前地址:http://www.chinadenli.net/article40/dscoeeo.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供移動(dòng)網(wǎng)站建設(shè)、靜態(tài)網(wǎng)站、網(wǎng)站營(yíng)銷、網(wǎng)站導(dǎo)航、網(wǎng)站維護(hù)、面包屑導(dǎo)航
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)