當前位置：軟件學堂 > 資訊首頁 > 網絡編程 > DIV+CSS > css控制鼠標指針

css控制鼠標指針

2012/11/26 10:55:59作者：佚名來源：網絡

移動端

【實例介紹】

css控制鼠標指針

在許多網站上我們可以看到很有個性的鼠標指針(cursor)，在網頁設計中用css可以方便地實現這樣個性鼠標指針的效果，該CSS屬性就是cursor屬性。一般而言，鼠標以斜向上的箭頭顯示，移到文本上時變為有頭的豎線，移到超級鏈接上變為手形。但用CSS可以控制鼠標的顯示效果，例如可使鼠標移到普通文本上時也顯示成手形。
下面為cursor屬性說明。

-----------------------------------------------------------------------------------------
值                        功能說明
-----------------------------------------------------------------------------------------
url                       需使用的自定義光標的URL
n-resize            此光標指示矩形框的邊緣可被向上移動
default                默認光標(通常是一個箭頭)
se-resize           此光標指示矩形框的邊緣可被向下及向右移動
auto                    默認。瀏覽器設置的光標
sw-rcsize           此光標指示矩形框的邊緣可被向下及向左移象
crosshair          光標呈現為十字線
s-resize             此光標指示矩形框的邊緣可被向下移動
pointer                光標呈現為指示鏈接的指針(一只手)
w-resizc             此光標指示矩形框的邊緣可被向左移動
move                  此光標指示某對象可被移動
wait                      此光標指示程序正忙(通常是一只表或沙漏)
e-resize               此光標指示矩形框的邊緣可被向右移動
help                      此光標指示可用的幫助(通常是一個問號或一個一
ne-resize             此光標指示矩形框的邊緣可被向上及向右移動
text                       此光標指示文本
nw-resize            此光標指示矩形框的邊緣可被向上及向左移動。
-----------------------------------------------------------------------------------------

【實例代碼】


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<style> 
.cursor1{cursor:hand}　
</style>
</head>
<body class="cursor1">
顯示你個性的鼠標指針
</body>
</html>

【代碼分析】

在代碼中，加粗代碼是將鼠標設置為手形，如圖所示。

控制鼠標指針

【素材及源碼下載】

請點擊：css控制鼠標指針下載本實例相關素材及源碼

標簽：鼠標

上一篇：css創建按鈕式超鏈接
下一篇：css列表符號類型list-style-type

相關文章

熱門軟件/ 推薦游戲/ 手機軟件

資訊分類

Dreamweaver Flash DIV+CSS 編程其他

推薦教程

精品軟件推薦

360安全衛士

訊飛輸入法

欧美一级一极性活片免费观看,欧美一级艳片欧美精品,欧美一级性爱大片,欧美一级囗交视频视频,欧美一级特黄录像视频