Thuộc tính color trong HTML DOM Style

Thuộc tính color trong HTML DOM Style dùng để lấy hoặc thiết lập màu sắc cho văn bản. Màu có thể chỉ định bằng hex, rgb(), rgba(), hsl(), hsla() hoặc tên màu.

Cú pháp

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

Giá trị tham số

Ví dụ minh họa

<!DOCTYPE html>
<html>
<body>
<h1>Ví dụ thuộc tính color</h1>
<p>Đoạn văn 1</p>
<p>Đoạn văn 2</p>
<p>Đoạn văn 3</p>
<p>Đoạn văn 4</p>
<p>Đoạn văn 5</p>
<p>Thay đổi màu các đoạn văn trên bằng cách nhấn nút dưới đây</p>
<button type="button" onclick="ChangeColor()">Thay đổi Màu Chữ</button>
<script>
  function ChangeColor() {
    for(var i=0; i<5; i++) {
      if(i%2==0)
        document.getElementsByTagName("P")[i].style.color = "blue";
      else
        document.getElementsByTagName("P")[i].style.color = "red";
    }
  }
</script>
</body>
</html>

Kết quả

Ban đầu 5 đoạn văn màu mặc định (đen). Sau khi nhấn "Thay đổi Màu Chữ", các đoạn chẵn (0,2,4) thành xanh dương, các đoạn lẻ (1,3) thành đỏ.

Mẹo: Dùng color cho màu chữ, backgroundColor cho màu nền.