Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Thuộc tính style outlineColor trong HTML DOM

Thuộc tính style.outlineColor trong HTML DOM trả về và cho phép thay đổi màu sắc (color) 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ị outlineColor

object.style.outlineColor

Thay đổi outlineColor

object.style.outlineColor = "color"

Ví dụ

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

<!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 outlineColor DOM</h1>
<p></p>
<button onclick="add()" class="btn">Thêm outline</button>
<script>
  function add() {
    document.querySelector('p').style.outlineColor = "#db133a";
  }
</script>
</body>
</html>

Kết quả

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