คุณสมบัติสี HTML DOM Style ใช้สำหรับรับหรือตั้งค่าสีสำหรับข้อความ สีสำหรับข้อความสามารถระบุเป็นเลขฐานสิบหก, rgb(), rgba(), hsl(), hsla() หรือใช้คีย์เวิร์ดที่รู้จัก
ต่อไปนี้เป็นไวยากรณ์สำหรับ −
การตั้งค่าคุณสมบัติสี −
object.style.color = "color|initial|inherit"
อธิบายคุณสมบัติข้างต้นดังนี้ −
| ค่า | คำอธิบาย |
|---|---|
| สี | สำหรับระบุค่าสีของข้อความ |
| เริ่มต้น | สำหรับการตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้น |
| สืบทอด | การสืบทอดค่าคุณสมบัติหลัก |
เรามาดูตัวอย่างคุณสมบัติสีกัน −
ตัวอย่าง
<!DOCTYPE html>
<html>
<body>
<h1>Color property example</h1>
<p>This is paragraph 1</p>
<p>This is paragraph 2</p>
<p>This is paragraph 3</p>
<p>This is paragraph 4</p>
<p>This is paragraph 5</p>
<p>Change the above paragraphs color by clicking the below button</p>
<button type="button" onclick="ChangeColor()">Change Text Color</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> ผลลัพธ์
เมื่อคลิกที่ “เปลี่ยนสีข้อความ” ปุ่ม −
