html实现鼠标悬停变成手型实现方式

1、采用a标签实现的方式

1 <a href="javascript:void()">内容</a>

1 内容

2、采用CSS实现的方式

1 // 变手形
2 oElement.style.cursor = "pointer";
3 
4 // 恢复原样
5 oElement.style.cursor = "default";

1 // 变手形 2 oElement.style.cursor = "pointer"; 3 4 // 恢复原样 5 oElement.style.cursor = "default";

或者

1 <div style="cursor:hand">
2 
3 <img style="cursor:hand">
4 
5 <td style="cursor:hand">

1

2 3 4 5

css写法：

1   <style>   
2        a.hand:hover   {cursor:hand}   
3   </style>

1

cursor其他取值

1   auto                     ：标准光标   
 2   default               ：标准箭头   
 3   hand                     ：手形光标   
 4   wait                     ：等待光标   
 5   text                     ：I形光标   
 6   vertical-text   ：水平I形光标   
 7   no-drop               ：不可拖动光标   
 8   not-allowed       ：无效光标   
 9   help                     ：?帮助光标   
10   all-scroll         ：三角方向标   
11   move                     ：移动标   
12   crosshair           ：十字标   
13   e-resize   
14   n-resize   
15   nw-resize   
16   w-resize   
17   s-resize   
18   se-resize   
19   sw-resize

1 auto ：标准光标 2 default ：标准箭头 3 hand ：手形光标 4 wait ：等待光标 5 text ：I形光标 6 vertical-text ：水平I形光标 7 no-drop ：不可拖动光标 8 not-allowed ：无效光标 9 help ：?帮助光标 10 all-scroll ：三角方向标 11 move ：移动标 12 crosshair ：十字标 13 e-resize 14 n-resize 15 nw-resize 16 w-resize 17 s-resize 18 se-resize 19 sw-resize

1、采用a标签实现的方式 1 内容 2、采用CSS实现的方式 1 // 变手形 2 oElement.style.cursor = "pointer"; 3 4 // 恢复原样 5 oElement.style.cursor = "default"; 或者 1

2 3 4 5 css写法： 1 cursor其他取值 1 auto ：标准光标 2 default ：标准箭头 3 hand ：手形光标 4 wait ：等待光标 5 text ：I形光标 6 vertical-text ：水平I形光标 7 no-drop ：不可拖动光标 8 not-allowed ：无效光标 9 help ：?帮助光标 10 all-scroll ：三角方向标 11 move ：移动标 12 crosshair ：十字标 13 e-resize 14 n-resize 15 nw-resize 16 w-resize 17 s-resize 18 se-resize 19 sw-resize