Cách đặt khoảng cách viền ảnh mở rộng ra khỏi hộp viền với JavaScript?

Sử dụng borderImageOutset để đặt khoảng cách viền ảnh mở rộng ra ngoài hộp viền.

Ví dụ

<!DOCTYPE html>
<html>
  <head>
    <style>
      div {
        background-color: gray;
        border: 40px solid;
        border-image: url('https://www.tutorialspoint.com/images/neo4j.png');
        border-image-slice: 50;
        border-image-width: 20px;
        border-image-width: 1 1 1 1;
        border-image-outset: 0;
        border-image-repeat: round;
      }
    </style>
  </head>
  <body>
    <div id="box"><p>Demo Text!</p></div>
    <button onclick="display()">Đặt viền ngoài</button>
    <script>
      function display() {
        document.getElementById("box").style.borderImageOutset = "5px 10px 20px 15px";
      }
    </script>
  </body>
</html>