Mã hex là cách chủ yếu dùng để khai báo các giá trị màu trong CSS, ngoài ra định dạng rgba đang được sử dụng ngày càng rộng rãi – trong đó a nghĩa là alpha hay còn gọi là độ trong suốt nằm trong khoảng từ 0 đến 1.
Dưới đây là một số cách khai báo hợp lệ:
- #RRGGBB (đây là cách tôi thường dùng nhất), viết hoa hay thường đều được, ví dụ:
color:#FFFFFF;
color:#ffffff;
- rgb(#R,#G,#B), các giá trị số từ 0 đến 255, ví dụ:
color:rgb(69,00,00);
- rgb(R%,G%,B%) – các giá trị phần trăm nằm trong khoảng từ 0 đến 100%, ví dụ,
color:rgb(23%,15%,25%);
- rgba(R,G,B,A), ví dụ:
color:rgb(69,00,00,0.3);
- Theo tên tiếng Anh của màu (đây là cách ưa thích của tôi), ví dụ:
color:red;
(xem thêm: Danh sách 17 tên màu tiêu chuẩn trong CSS)
Dưới đây là 2 hình vuông 200px với cùng mã màu #690000 với độ trong suốt là 0.3 ở bên trái, và 0.95 ở bên phải:
Code mẫu:
<div style="background-color: rgba(69,00,00,.3); float: left; height: 200px; width: 33%;"> </div>
<div style="background-color: rgba(69,00,00,.95); float: right; height: 200px; width: 33%;"> </div>