0


用css 添加手状样式,鼠标移上去变小手

实现这个效果一共有两种方式。

    1.第一种方式:(先两个div)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>第一个</title>
    </head>
        <style>
        div{
        cursor:pointer;
            }
</style>
    <body>
        
    <div href="#">11 </div>
    <div href="#">22 </div>
    </body>
</html>
            2.用a包裹

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>第一个</title>
    </head>
     
    <body>
        <a href="">
            <div href="#">11 </div>
            <div href="#">22 </div>
        </a>
    </body>
</html>
    除此之外cursor还有别的属性

     auto                                     :标准光标  
     default                                 :标准箭头  
     pointer, hand                       :手形光标  
     wait                                     :等待光标  
     text                                      :I形光标  
     vertical-text                         :水平I形光标  
     no-drop                               :不可拖动光标  
     not-allowed                         :无效光标  
     help                                     :帮助光标  
     all-scroll                               :三角方向标  
     move                                   :移动标  
     crosshair                           :十字标  
     e-resize                                  :此光标指示矩形框的边缘可被向右(东)移动。
     n-resize                                  :此光标指示矩形框的边缘可被向上(北)移动。
     nw-resize                                  :此光标指示矩形框的边缘可被向上及向左移动(北/西)。
     w-resize                                  :此光标指示矩形框的边缘可被向左移动(西)
     s-resize                                  :此光标指示矩形框的边缘可被向下移动(南)
     se-resize                                  :此光标指示矩形框的边缘可被向下及向右移动(南/东)。

    sw-resize                                :此光标指示矩形框的边缘可被向下及向左移动(南/西)
标签: html5 css3 html

本文转载自: https://blog.csdn.net/tea_tea_/article/details/125839378
版权归原作者 Tea-pd 所有, 如有侵权,请联系我们删除。

“用css 添加手状样式,鼠标移上去变小手”的评论:

还没有评论