1. <style>
    2. *{
    3. list-style: none;
    4. }
    5. .default:hover{
    6. cursor: default;
    7. /* 默认光标(通常是一个箭头) */
    8. }
    9. .auto:hover{
    10. cursor: auto;
    11. /*默认。浏览器设置的光标*/
    12. }
    13. .crosshair:hover{
    14. cursor: crosshair;
    15. /*光标成十字线*/
    16. }
    17. .pointer:hover{
    18. cursor:pointer;
    19. /*光标呈现为指示链接的指针(一只手)*/
    20. }
    21. .move:hover{
    22. cursor: move;
    23. /*此光标指示某对象可被移动。*/
    24. }
    25. .e-resize:hover{
    26. cursor: e-resize;
    27. /*此光标指示矩形框的边缘可被向右(东)移动。*/
    28. }
    29. .ne-resize:hover{
    30. cursor: ne-resize;
    31. /*此光标指示矩形框的边缘可被向上及右移动(北/东)。*/
    32. }
    33. .nw-resize:hover{
    34. cursor: nw-resize;
    35. /*此光标显示矩形的边缘可被向上及向左移动(北/西)。*/
    36. }
    37. .n-resize:hover{
    38. cursor: n-resize;
    39. /*此光标显示矩形的边缘可被向上及向上(北)移动。*/
    40. }
    41. .se-resize:hover{
    42. cursor: se-resize;
    43. /*此光标显示矩形的边缘可被向上及向下向右移动(南/东)。*/
    44. }
    45. .sw-resize:hover{
    46. cursor: sw-resize;
    47. /*此光标显示矩形的边缘可被向上及向下及向左移动(南/西)。*/
    48. }
    49. .s-resize:hover{
    50. cursor: s-resize;
    51. /*此光标显示矩形的边缘可被向下移动(北/西)。*/
    52. }
    53. .w-resize:hover{
    54. cursor: w-resize;
    55. /*此光标显示矩形的边缘可被向左移动(西)。*/
    56. }
    57. .text:hover{
    58. cursor: text;
    59. /* 此光标指文本 */
    60. }
    61. .wait:hover{
    62. cursor: wait;
    63. /*此光标指示程序正忙(通常是一只表或沙漏)*/
    64. }
    65. .help:hover{
    66. cursor: help;
    67. /*此光标指示可用的帮助(通常是一个问号或一个气球)。*/
    68. }
    69. </style>
    70. </head>
    71. <ul>
    72. <li class="default">default</li>
    73. <li class="auto">auto</li>
    74. <li class="crosshair">crosshair</li>
    75. <li class="pointer">pointer</li>
    76. <li class="move">move</li>
    77. <li class="e-resize">e-resize</li>
    78. <li class="ne-resize">ne-resize</li>
    79. <li class="nw-resize">nw-resize</li>
    80. <li class="n-resize">n-resize</li>
    81. <li class="se-resize">se-resize</li>
    82. <li class="sw-resize">sw-resize</li>
    83. <li class="s-resize">s-resize</li>
    84. <li class="w-resize">w-resize</li>
    85. <li class="text">text</li>
    86. <li class="wait">wait</li>
    87. <li class="help">help</li>
    88. </body>