| cursor:auto; | 自動 |
| cursor:zoom-in; | 放大鏡 |
| cursor:zoom-out; | 縮小鏡 |
| cursor:all-scroll; | 上下左右任何方向滾動 |
| cursor:crosshair; | 十字准心 |
| cursor:pointer; | 手 |
| cursor:wait; | 等待 |
| cursor:help; | 幫助 |
| cursor:no-drop; | 無法釋放 |
| cursor:text; | 文字/編輯 |
| cursor:move; | 可移動對象 |
| cursor:vertical-text; | 可編輯的垂直文本的光標 |
| cursor:n-resize; | 向上改變大小(North) |
| cursor:s-resize; | 向下改變大小(South) |
| cursor:e-resize; | 向右改變大小(East) |
| cursor:w-resize; | 向左改變大小(West) |
| cursor:ne-resize; | 向上右改變大小(North East) |
| cursor:nw-resize; | 向上左改變大小(North West) |
| cursor:se-resize; | 向下右改變大小(South East) |
| cursor:sw-resize; | 向下左改變大小(South West) |
| cursor:col-resize; | 可被水平改變尺寸 |
| cursor:row-resize; | 可被垂直改變尺寸 |
| cursor:not-allowed; | 禁止 |
| cursor:progress; | 處理中 |
| cursor:default; | 系統默認 |
| cursor:url('#');#為光標文件地址 (注意文件格式必須為:.cur或.ani) |
用戶自定義(可用動畫) 注意:在定義完自定義的游標之后在末尾加上一般性的游標, 以防那些url所定義的游標不能使用 |
說明:
cursor 屬性:設置顯示的光標的類型(形狀)。
此屬性的值可以是多個,其間要用逗號分隔;
假如第一個值無法找到而不能被顯示,則第二個值將被嘗試使用,依此類推;
假如全部值都不可用的話,則此屬性不會發生作用,光標也不會被改變。
比如:{cursor:pointer,wait,help;},從pointer到wait,再到help,如果都沒被應用,則cursor屬性不起任何作用。
現在舉一個“手”光標的例子,寫法有兩種:
效果圖:
| cursor:pointer; | 手 |
第一種是行內樣式:(行內樣式:將CSS樣式編寫在標簽之中)
<table border="1">
<tr class="pointer" style="cursor:pointer;">
<td>cursor:pointer;</td>
<td>手</td>
</tr>
</table>
第二種是內部樣式:(內部樣式:由<style>標簽定位在<head>之中)
<!-- 這里是style里面的內容 -->
<style type="text/css">
.pointer:hover{
cursor:pointer;
}
</style>
<!-- 這里是body里面的內容 -->
<body>
<table border="1">
<tr class="pointer">
<td>cursor:pointer;</td>
<td>手</td>
</tr>
</table>
</body>

