Để thêm màu nền cho element HTML, dùng thuộc tính CSS background-color.
Giả sử bạn có HTML sau, muốn thêm màu nền cho <body>:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Thay đổi màu nền HTML/CSS</title> </head> <body> <h1>Đây là một trang web tuyệt vời!</h1> </body> </html>Cách đơn giản nhất là tạo element <style> nội bộ trong tài liệu HTML.
Trong element <head> trong HTML, tạo cặp thẻ <style></style>. Sau đó thêm quy tắc CSS màu nền vào <style>.
<head> <meta charset="UTF-8"> <title>Thay đổi màu nền HTML/CSS</title> <style> body { background-color: #78a8eb; } </style> </head>HTML và CSS này cho trang web trông như sau:
Ký pháp màu
Giá trị #78a8eb cho background-color viết theo ký pháp thập lục phân (hexadecimal), gọi tắt là hex. Biểu diễn màu bằng bộ ký tự cho kênh Red, Green, Blue. Ký tự từ 0-9 rồi A-F. 0 là giá trị thấp nhất, F cao nhất.
Bạn cũng có thể biểu diễn màu CSS bằng ký pháp khác.
Ví dụ, ký pháp hàm rgba(). Ví dụ trên viết như sau:
background-color: rgb(120, 168, 235);Hoặc ký pháp HSL (Hue, Saturation, Lightness):
background-color: hsl(215, 74%, 70%);Ba cách viết màu này đều chấp nhận được trên trình duyệt hiện đại.
Phương pháp lỗi thời (không dùng)
Trong phiên bản chuẩn web cũ, người ta dùng thuộc tính bgcolor với màu hex ngay trong thẻ HTML:
<body bgcolor="#78a8eb" ></body>Tuy nhiên, đây là cách cũ đặt màu nền. Không nên dùng nữa — chỉ dùng CSS để kiểm soát màu.