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

Làm thế nào để bù đắp một đường viền và vẽ nó ra ngoài rìa đường viền bằng JavaScript?

Để bù đắp một đường viền, hãy sử dụng outlineOffset bất động sản. Nó cho phép bạn vẽ đường viền ngoài mép viền.

Bạn có thể thử chạy đoạn mã sau để bù đắp một đường viền và vẽ nó ra ngoài đường viền bằng JavaScript.

Ví dụ

<!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 Offset.</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 Offset</button>
      <br>
      <script>
         function display() {
            document.getElementById("box").style.outline = "thick solid";
            document.getElementById("box").style.outlineColor = "#5F5F5F";
            document.getElementById("box").style.outlineOffset = "7px";
         }
      </script>
   </body>
</html>