CSS Colors

Trong CSS màu sắc được chỉ định bằng cách sử dụng tên màu, hoặc các giá trị RGB, HEX, HSL, RGBA, HSLA được định nghĩa trước.

CSS Color Name

Trong CSS, một màu sắc có thể được chỉ định bằng cách sử dụng một tên màu được định nghĩa trước:

CSS/HTML hỗ trợ 140 tên màu tiêu chuẩn.

CSS Background Color

Bạn có thể thiết lập màu nền cho các phần tử HTML:

Ví dụ:

<h1 style="background-color:DodgerBlue;">Hello World</h1>
<p style="background-color:Tomato;">Lorem ipsum...</p>

CSS Text Color

Bạn có thể thiết lập màu sắc của đoạn văn bản:

Ví dụ:

<h1 style="color:Tomato;">Hello World</h1>
<p style="color:DodgerBlue;">Lorem ipsum...</p>
<p style="color:MediumSeaGreen;">Ut wisi enim...</p>

CSS Border Color

Bạn có thể thiết lập màu sắc của các border:

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>

CSS Color Values

Trong CSS, màu sắc cũng có thể được chỉ định bằng cách sử dụng các giá trị RGB, HEX, HSL, RGBA, và HSLA:

Tương tự như tên màu "Tomato":

Tương tự như tên màu "Tomato", nhưng 50% transparent:

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>

Tìm hiểu thêm về Color Values

Bạn sẽ tìm hiểu thêm về các giá trị RGB, HEX và HSL trong các chương tiếp theo.