HTML สี
สี HTML ถูกกำหนดด้วยชื่อสีที่กำหนดไว้ล่วงหน้า หรือด้วยค่า RGB, HEX, HSL, RGBA หรือ HSLA
ชื่อสี
ใน HTML สามารถระบุสีได้โดยใช้ชื่อสี:
มะเขือเทศ
ส้ม
DodgerBlue
กลางทะเลสีเขียว
สีเทา
กระดานชนวนสีฟ้า
สีม่วง
แสงสีเทา
HTML รองรับ ชื่อ สีมาตรฐาน 140 ชื่อ
สีพื้นหลัง
คุณสามารถตั้งค่าสีพื้นหลังสำหรับองค์ประกอบ HTML:
สวัสดีชาวโลก
ความเจ็บปวดคือความรัก จึงเป็นเหตุให้เกิดขึ้นมาเพียงเล็กน้อยเท่านั้น ที่ผู้ปฏิบัติธรรมดาของเราแบกรับผลที่ตามมา
ตัวอย่าง
<h1 style="background-color:DodgerBlue;">Hello World</h1>
<p style="background-color:Tomato;">Lorem
ipsum...</p>
สีข้อความ
คุณสามารถกำหนดสีของข้อความ:
สวัสดีชาวโลก
ความเจ็บปวดคือความรัก
จึงเป็นเหตุให้เกิดขึ้นมาเพียงเล็กน้อยเท่านั้น ที่ผู้ปฏิบัติธรรมดาของเราแบกรับผลที่ตามมา
ตัวอย่าง
<h1 style="color:Tomato;">Hello
World</h1>
<p style="color:DodgerBlue;">Lorem
ipsum...</p>
<p style="color:MediumSeaGreen;">Ut wisi
enim...</p>
เส้นขอบสี
คุณสามารถกำหนดสีของเส้นขอบ:
สวัสดีชาวโลก
สวัสดีชาวโลก
สวัสดีชาวโลก
ตัวอย่าง
<h1 style="border:2px
solid Tomato;">Hello
World</h1>
<h1 style="border:2px
solid DodgerBlue;">Hello
World</h1>
<h1 style="border:2px
solid Violet;">Hello
World</h1>
ค่าสี
ใน HTML สีสามารถระบุได้โดยใช้ค่า RGB, ค่า HEX, ค่า HSL, ค่า RGBA และค่า HSLA
องค์ประกอบ <div> สามรายการต่อไปนี้มีการตั้งค่าสีพื้นหลังด้วยค่า RGB, HEX และ HSL:
rgb(255, 99, 71)
#ff6347
hsl(9, 100%, 64%)
องค์ประกอบ <div> สองรายการต่อไปนี้มีการตั้งค่าสีพื้นหลังด้วยค่า RGBA และ HSLA ซึ่งเพิ่มช่องอัลฟ่าให้กับสี (ในที่นี้เรามีความโปร่งใส 50%):
rgba (255, 99, 71, 0.5)
สลา (9, 100%, 64%, 0.5)
ตัวอย่าง
<h1 style="background-color:rgb(255,
99, 71);">...</h1>
<h1 style="background-color:#ff6347;">...</h1>
<h1 style="background-color:hsl(9,
100%, 64%);">...</h1>
<h1 style="background-color:rgba(255,
99, 71, 0.5);">...</h1>
<h1 style="background-color:hsla(9,
100%, 64%, 0.5);">...</h1>