Thuộc tính style outlineStyle trong HTML DOM

Thuộc tính style.outlineStyle trong HTML DOM trả về và cho phép thay đổi kiểu dáng (style) của viền ngoài (outline) quanh một phần tử trong tài liệu HTML.

Cú pháp

Lấy giá trị outlineStyle

object.style.outlineStyle

Thay đổi outlineStyle

object.style.outlineStyle = "value"

Ví dụ

Ví dụ sử dụng thuộc tính style.outlineStyle:

<!DOCTYPE html>
<html>
<head>
<style>
  body { color: #000; background: lightblue; height: 100vh; }
  p { background-color: seagreen; height: 200px; width: 200px; outline: 2px solid #000; }
  .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; }
</style>
</head>
<body>
<h1>Ví dụ thuộc tính style outlineStyle DOM</h1>
<p></p>
<button onclick="add()" class="btn">Thêm outline</button>
<script>
  function add() {
    document.querySelector('p').style.outlineStyle = "dashed";
  }
</script>
</body>
</html>

Kết quả

Nhấn nút Thêm outline để thay đổi kiểu dáng viền ngoài quanh hộp màu xanh lá.