Div获得鼠标焦点时自动放大

//method 1(id选择器)

<html>
    <head>
        <meta charset="UTF-8">
        <title>Test</title>
        <style type="text/css">   
            #extend:HOVER {
            cursor: pointer;
            transition: all 0.6s;
            transform: scale(1.5);
            }
        </style>
    </head>

    <body>
        <div id="extend" style="background-color:#09FFCB; height:100px; width:100px;float:left;">test1</div>
        <div id="extend" style="background-color:#ABFE05; height:100px; width:100px;float:left;margin-left:50px;">test2</div>
    </body>
</html>


//method 2(元素选择器)  

<html>
    <head>
        <meta charset="UTF-8">
        <title>Test</title>
        <style type="text/css">   
            div:HOVER {
            cursor: pointer;
            transition: all 0.6s;
            transform: scale(1.5);
            }
        </style>
    </head>

    <body>
        <div style="background-color:#09FFCB; height:100px; width:100px;float:left;">test1</div>
        <div style="background-color:#ABFE05; height:100px; width:100px;float:left;margin-left:50px;">test2</div>
    </body>
</html>

来源：CSDN

作者：无名小卒WTY

链接：https://blog.csdn.net/weixin_41634085/article/details/82454792

标签

div

易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!