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

Làm cách nào để thiết lập kiểu đường viền xung quanh một phần tử bằng JavaScript?


Để đặt kiểu phác thảo, hãy sử dụng outlineStyle bất động sản. Đường viền có thể liền mạch, có dấu chấm, đứt nét, v.v.

Ví dụ

Bạn có thể thử chạy mã sau để đặt kiểu của đường viền xung quanh một phần tử bằng JavaScript -

<!DOCTYPE html>
<html>
   <head>
      <style>
         #box {
            width: 450px;
            background-color: orange;
            border: 3px solid red;
            margin-left: 20px;
         }
      </style>
   </head>
   <body>
      <p>Click below to add Outline Style.</p>
      <div id="box">
         <p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
      </div>
      <br>
      <button type="button" onclick="display()">Set Outline Style</button>
      <br>
      <script>
         function display() {
            document.getElementById("box").style.outlineColor = "#5F5F5F";
            document.getElementById("box").style.outlineStyle = "solid";
         }
      </script>
   </body>
</html>