Sử dụng color name
Trong HTML bạn có thể dùng color name để chỉ định màu sắc:
Background Color
Bạn có thể chỉ định background color cho một element:
Ví dụ
<h1 style="background-color:DodgerBlue;">Hello World</h1> <p style="background-color:Tomato;">Lorem ipsum...</p>
Text Color
Bạn có thể thay đổi màu sắc của văn bản:
Hello World
Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet ipsa quidem, eligendi quaerat corporis velit laboriosam sunt voluptates eum illo error incidunt possimus, similique praesentium deleniti qui suscipit perspiciatis saepe?
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Ví dụ
<h3 style="color:Tomato;">Hello World</h3> <p style="color:DodgerBlue;">Lorem ipsum...</p> <p style="color:MediumSeaGreen;">Ut wisi enim...</p>
Border Color
Bạn có thể thay đổi màu sắc của đường viền:
Hello World
Hello World
Hello World
Ví dụ
<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>
Các kiểu giá trị Color
Trong HTML để chỉ định màu bạn có thể sử dụng các giá trị RGB, HEX, HSL, RGBA, HSLA.
Theo dõi các element bên dưới để xem background color được chỉ định với giá trị RGB, HEX, và HSL.
rgb(255, 99, 71)
#ff6347
hsl(9, 100%, 64%)
Theo dõi các element bên dưới để xem background color được chỉ định với giá trị RGBA và HSLA với thuộc tính alpha (giá trị trong suốt 50%):
rgba(255, 99, 71, 0.5)
hsla(9, 100%, 64%, 0.5)
Ví dụ
<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>