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á.