How to change button color on hover in JavaScript?

Asked 19-Jul-2021
Viewed 294 times

1 Answer


2

We know that, in CSS psuedo selector is use to decorating the page elements.

    <!DOCTYPE html>
<html lang='en' xmlns='http://www.w3.org/1999/xhtml'>
<head>
    <meta charset='utf-8' />
    <title></title>
    <style>
        * {
            text-align:center;
            margin:50px;
        }
        #btn {
            background-color:lightblue;
            width:30%;
            height:70px;
            border:1px solid white;
            border-radius:10px;
            color:white;
            transition:0.3s;
            font-size:15px;
        }
            #btn:hover {
                font-size:25px;
                background-color:orange;
                border:2px solid white;
            }
    </style>
</head>
<body>
    <button id='btn' >Hover Me</button>
</body>
</html> 

Loading...
Ads