วิธีเปลี่ยนสีข้อความขององค์ประกอบใน HTML

ใช้แอตทริบิวต์ color ใน HTML เพื่อแสดงสีของข้อความ

หมายเหตุ: แอตทริบิวต์นี้ ไม่รองรับใน HTML5

ตัวอย่าง

คุณสามารถลองรันโค้ดต่อไปนี้เพื่อเรียนรู้การใช้แอตทริบิวต์ color ใน HTML:

<!DOCTYPE html> 
<html> 
  <head> 
    <title>HTML Background Colors</title> 
  </head> 
  <body> 
    <table width="100%"> 
      <tr> 
        <td> 
          <p><font color="blue">นี่คือข้อความสาธิต</font></p> 
        </td> 
      </tr> 
    </table> 
  </body> 
</html>

วิธีที่แนะนำ (ใช้ CSS)

<!DOCTYPE html> 
<html> 
  <head> 
    <style> 
      .text-blue { color: blue; }
      .text-red { color: #ff0000; }
      .text-rgb { color: rgb(0, 128, 0); }
    </style> 
  </head> 
  <body> 
    <p class="text-blue">สีน้ำเงินด้วย CSS</p> 
    <p class="text-red">สีแดงด้วย HEX</p> 
    <p class="text-rgb">สีเขียวด้วย RGB</p> 
  </body> 
</html>

CSS รองรับรูปแบบสีหลากหลาย: ชื่อสี, HEX, RGB, RGBA, HSL, HSLA