Thuộc tính borderBottomColor trong HTML DOM Style

Thuộc tính borderBottomColor đặt hoặc lấy màu viền dưới của phần tử. Lưu ý: phải khai báo border-style trước (phần tử phải có viền) thì thuộc tính này mới có hiệu lực.

Cú pháp

Thiết lập:

object.style.borderBottomColor = "color|transparent|initial|inherit"

Lấy giá trị:

object.style.borderBottomColor

Các giá trị

Giá trị	Mô tả
color	Màu viền dưới (mặc định đen).
transparent	Viền dưới trong suốt.
initial	Đặt về mặc định.
inherit	Kế thừa từ cha.

Ví dụ

Thay đổi màu viền dưới ảnh:

<!DOCTYPE html> <html> <head> <style> 
  #IMG1 { 
    border-bottom: 7px solid orange; 
    box-shadow: 2px 2px 4px 1px seagreen; 
  } 
</style> 
<script> 
  function changeBorder(){ 
    document.getElementById("IMG1").style.borderBottomColor = "pink"; 
    document.getElementById("Sample").innerHTML = "Màu viền dưới ảnh đã thay đổi"; 
  } 
</script> </head> 
<body> 
<h2>Học iOS</h2> 
<img id="IMG1" src="https://www.tutorialspoint.com/ios/images/ios.jpg"> 
<p>Nhấn nút để đổi màu viền dưới</p> 
<button onclick="changeBorder()">THAY ĐỔI VIỀN DƯỚI</button> 
<p id="Sample"></p> 
</body> </html>

Kết quả

Viền dưới cam 7px solid:

Thuộc tính borderBottomColor trong HTML DOM Style

Sau khi nhấn nút: viền dưới hồng:

Thuộc tính borderBottomColor trong HTML DOM Style