一、基本語法及示例1<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />
cursor版本：CSS2 兼容性：IE4.0+ NS6.0+ 繼承性：有
語法：
cursor : auto | all-scroll | col-resize| crosshair | default | hand | move | help | no-drop | not-allowed | pointer | progress | row-resize | text | vertical-text | wait | *-resize | url ( url )
取值：
auto : 默認值。瀏覽器根據當前情況自動確定鼠標光標類型。
all-scroll : IE6.0 有上下左右四個箭頭，中間有一個圓點的光標。用於標示頁面可以向上下左右任何方向滾動。
col-resize : IE6.0 有左右兩個箭頭，中間由豎線分隔開的光標。用於標示項目或標題欄可以被水平改變尺寸。
crosshair : 簡單的十字線光標。
default : 客戶端平臺的默認光標。通常是一個箭頭。
hand : 豎起一隻手指的手形光標。就像通常用戶將光標移到超鏈接上時那樣。
move : 十字箭頭光標。用於標示對象可被移動。
help : 帶有問號標記的箭頭。用於標示有幫助信息存在。
no-drop : IE6.0 帶有一個被斜線貫穿的圓圈的手形光標。用於標示被拖起的對象不允許在光標的當前位置被放下。
not-allowed : IE6.0 禁止標記(一個被斜線貫穿的圓圈)光標。用於標示請求的操作不允許被執行。
pointer : IE6.0 和 hand 一樣。豎起一隻手指的手形光標。就像通常用戶將光標移到超鏈接上時那樣。
progress : IE6.0 帶有沙漏標記的箭頭光標。用於標示一個進程正在後臺運行。
row-resize : IE6.0 有上下兩個箭頭，中間由橫線分隔開的光標。用於標示項目或標題欄可以被垂直改變尺寸。
text : 用於標示可編輯的水平文本的光標。通常是大寫字母 I 的形狀。
vertical-text : IE6.0 用於標示可編輯的垂直文本的光標。通常是大寫字母 I 旋轉90度的形狀。
wait : 用於標示程序忙用戶需要等待的光標。通常是沙漏或手錶的形狀。
*-resize : 用於標示對象可被改變尺寸方向的箭頭光標。w-resize | s-resize | n-resize | e-resize | ne-resize | sw-resize | se-resize | nw-resize
url ( url ) : IE6.0 用戶自定義光標。使用絕對或相對 url 地址指定光標文件(後綴爲 .cur 或者 .ani )。
說明：
設置或檢索在對象上移動的鼠標指針採用的光標形狀。
此屬性的值可以是多個，其間用逗號分隔。假如第一個值不可以被客戶端系統理解或所指定的光標無法找到及顯示，則第二個值將被嘗試使用。依此類推。假如全部值都不可用的話，則此屬性不會發生作用。光標不會被改變。
此屬性對於 currentStyle 對象而言是隻讀的。對於其他對象而言是可讀寫的。
對應的腳本特性爲 cursor 。
示例：
p { cursor: text; }
a { cursor: pointer; }
body { cursor: url("mycursor.gif"), url("images/cursors/footcursor.jpg"), default; }
說個例子：
<input id="txt1" type="text" style="cursor:hand">
<lable style="cursor:default">aaaaaaaaaa</lable>
<script language="javascript">
txt1.style.cursor="move";
</script>
二、示例2
<html>
<head>
<title>
各種鼠標形狀
</title>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<!-下面定義css屬性 -->
<style type="text/css">
a{
text-decoration:none;
}
</style>
</head>
<body>
<p align="center">
<font face="金山簡行楷" size="4" color="blue">
注意
<br>
各種各樣的鼠標形狀
</font>
</p>
<hr width="100%" size="4" color="#008000">
<div align="center">
<center>
<!--下面的表格中的每一個單元中都能夠顯示不同的鼠標形狀 -->
<table border="1" width="300" bordercolor="#FF0000">
<tr>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:auto">
自動形狀
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:crosshair">
十字形狀
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:default">
一般箭頭
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:move">
移動光標
</a>
</font>
</td>
</tr>
<tr>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:e-resize">
向右箭頭
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:ne-resize">
右上箭頭
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:se-resize">
右下箭頭
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:n-resize">
向上箭頭
</a>
</font>
</td>
</tr>
<tr>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:nw-resize">
左上箭頭
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:w-resize">
向左箭頭
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:sw-resize">
左下箭頭
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:s-resize">
向下箭頭
</a>
</font>
</td></tr>
<tr>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:text">
文本光標
</a>
</font></td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:wait">
漏斗形狀
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:help">
幫助光標
</a>
</font>
</td>
<td valign="middle" align="center">
<font face="隸書" size="2">
<a href="" style="cursor:hand">
手形光標
</a></font>
</td></tr>
</table>
</center></div>
</body>
</html>
三、示例3
答案一
style="cursor:hand;"
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)
p { cursor: text; }
a { cursor: pointer; }
body { cursor: url("mycursor.gif"), url("images/cursors/footcursor.jpg"), default; }
答案二
源代碼是這樣的，
document.all.theTop.style.cursor = "crosshair";
運行結果，鼠標是十字架。
