Computer >> Máy Tính >  >> Lập trình >> CSS

Thêm hiệu ứng nhấn khi nhấp vào nút bằng CSS

Bạn có thể thử chạy đoạn mã sau để thêm hiệu ứng được nhấn khi nhấp vào nút

Ví dụ

<!DOCTYPE html>
<html>
   <head>
      <style>
         .button {
            background-color: orange;
            color: white;
            border: none;
            border-radius: 7px;
            box-shadow: 0 5px #999;
            display: inline-block;
            padding: 10px;
            font-size: 16px;
            cursor: pointer;
            text-align: center;
            outline: none;
         }
         .button:hover {
            background-color: blue;
         }
         .button:active {
            background-color: orange;
            box-shadow: 0 5px gray;
            transform: translateY(2px);
         }
      </style>
   </head>
   <body>
      <button class = "button">Result</button>
   </body>
</html>