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

Làm cách nào để đính kèm một hoặc nhiều bóng đổ vào hộp bằng JavaScript?


Để gắn bóng đổ vào hộp, hãy sử dụng thuộc tính boxShadow trong JavaScript. Với thuộc tính này, hãy thêm chiều rộng của bóng cũng như màu sắc.

Ví dụ

Bạn có thể thử chạy đoạn mã sau để tìm hiểu cách đính kèm một hoặc nhiều bóng đổ.

<!DOCTYPE html>
<html>
   <head>
      <style>
         #box {
            border: thick solid green;
            width: 300px;
            height: 200px
         }
      </style>
   </head>
   <body>
      <div id="box">Demo Text</div>
      <br><br>
      <button type="button" onclick="display()">Add drop shadow</button>
      <script>
         function display() {
            document.getElementById("box").style.boxShadow = "20px 15px 25px orange";
         }
      </script>
   </body>
</html>