Mã màu HTML

Màu sắc được hiển thị là sự kết hợp từ 3 màu đỏ, xanh lá và xanh dương.

Tên màu

Với CSS, màu có thể được đặt bằng cách sử dụng tên màu.

Ví dụ:

MàuTên
Tên màuMàu đỏ
Màu vàng
Lục lam
Màu xanh da trời
Đỏ tươi

Tên màu được tất cả trình duyệt hỗ trợ

Tất cả các trình duyệt hiện đại đều hỗ trợ 140 tên màu sau (nhấp vào tên màu hoặc giá trị hex, để xem màu dưới dạng màu nền cùng với các màu văn bản khác nhau):

Tên màu được tất cả trình duyệt hỗ trợ

Giá trị màu CSS

Với CSS, màu sắc có thể được chỉ định theo nhiều cách khác nhau:

  • Theo tên màu
  • Dưới dạng giá trị RGB
  • Dưới dạng giá trị thập lục phân
  • Dưới dạng giá trị HSL (CSS3)
  • Dưới dạng giá trị HWB (CSS4)
  • Với từ khóa currentcolor

Màu RGB

Giá trị màu RGB được hỗ trợ trong tất cả các trình duyệt.

Giá trị màu RGB được chỉ định bằng: rgb (RED, GREEN, BLUE).

Mỗi tham số xác định cường độ của màu là một số nguyên từ 0 đến 255.

Ví dụ: rgb (0,0,255) được hiển thị dưới dạng màu xanh lam, vì tham số màu xanh lam được đặt thành giá trị cao nhất (255) và các thông số khác được đặt thành 0.

Ví dụ:

MàuRGBMàu

Màu RGB

rgb(255,0,0)Đỏ
rgb(0,255,0)Xanh lá
rgb(0,0,255)Xanh dương

Các sắc thái của màu xám thường được xác định bằng cách sử dụng các giá trị bằng nhau cho cả 3 nguồn sáng:

Ví dụ:

MàuRGBMàu
Các sắc thái của màu xámrgb(0,0,0)Đen
rgb(128,128,128)Xám
rgb(255,255,255)Trắng

Màu thập lục phân

Giá trị màu hệ thập lục phân cũng được hỗ trợ trong tất cả các trình duyệt.

Màu thập lục phân được chỉ định bằng: #RRGGBB.

RR (đỏ), GG (xanh lục) và BB (xanh lam) là các số nguyên thập lục phân từ 00 đến FF chỉ định cường độ của màu.

Ví dụ: #0000FF được hiển thị là màu xanh lam, vì thành phần màu xanh lam được đặt thành giá trị cao nhất (FF) và các thành phần khác được đặt thành 00.

Ví dụ:

MàuHEXRGBMàu
Màu thập lục phân#FF0000rgb(255,0,0)Đỏ
#00FF00rgb(0,255,0)Xanh lá
#0000FFrgb(0,0,255)Xanh dương

Các sắc thái của màu xám thường được xác định bằng cách sử dụng các giá trị bằng nhau cho cả 3 nguồn sáng.

Ví dụ:

MàuHEXRGBMàu
Các sắc thái của màu xám#000000rgb(0,0,0)Đen
#808080rgb(128,128,128)Xám
#FFFFFFrgb(255,255,255)Trắng


Lưu ý: Bạn có thể sử dụng chữ hoa hoặc chữ thường để chỉ định các giá trị thập lục phân. Chữ thường dễ viết hơn, còn chữ hoa dễ đọc hơn.

Từ khóa currentcolor

Từ khóa currentcolor đề cập đến giá trị thuộc tính màu của một phần tử.

Ví dụ, màu đường viền của phần tử <div> sau sẽ là màu xanh lam vì màu văn bản của phần tử <div> là màu xanh lam:

#myDIV {
  color: blue; /* Blue text color */
  border: 10px solid currentcolor; /* Blue border color */
}
Thứ Hai, 09/05/2022 09:52
52 👨 359
0 Bình luận
Sắp xếp theo