Nền HTML

Màu nền tốt làm cho trang web trông rất đặc biệt.

Ví dụ

Kết hợp nền và màu tốt
Một ví dụ tốt về sự kết hợp màu nền và màu văn bản, làm cho văn bản trên trang dễ đọc.
Kết hợp màu nền và màu văn bản không tốt
Một ví dụ xấu về sự kết hợp màu nền và màu văn bản, làm cho văn bản trên trang khó đọc.

（Bạn có thể tìm thấy nhiều ví dụ hơn ở cuối trang này。）

Nền (Backgrounds)

<body> có hai thẻ cấu hình nền. Nền có thể là màu hoặc hình ảnh.

Màu nền (Bgcolor)

Thuộc tính màu nền sẽ đặt nền phông thành màu nào đó. Giá trị có thể là số hexa, giá trị RGB hoặc tên màu.

<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">

Mã trên đều đặt màu nền thành đen.

Nền (Background)

Thuộc tính nền sẽ đặt nền thành hình ảnh. Giá trị thuộc tính là URL của hình ảnh. Nếu kích thước hình ảnh nhỏ hơn cửa sổ trình duyệt, hình ảnh sẽ được sao chép toàn bộ trên cửa sổ trình duyệt.

<body background="clouds.gif">
<body background="http://www.codew3c.com/clouds.gif">

URL có thể là địa chỉ tương đối, như dòng mã đầu tiên. Cũng có thể là địa chỉ tuyệt đối, như dòng mã thứ hai.

Lưu ý:Nếu bạn dự định sử dụng hình nền, bạn cần nhớ một số điểm sau:

  • Hình nền có làm tăng thời gian tải trang của trang không. Lưu ý: Tệp hình ảnh không nên vượt quá 10k.
  • Hình nền có phù hợp với các hình ảnh khác trong trang không?
  • Hình nền có phù hợp với màu văn bản trong trang không?
  • Hình ảnh khi lát đều trên trang có nhìn được không?
  • Lưu ý: Đối tượng chú ý của văn bản có bị hình nền làm mất đi không?

Lưu ý cơ bản - Các mẹo hữu ích:

Thuộc tính màu nền (bgcolor), nền (background) và văn bản (text) trong thẻ <body> đã bị bỏ đi trong tiêu chuẩn HTML mới nhất (HTML4 và XHTML). W3C đã loại bỏ các thuộc tính này trong tiêu chuẩn推荐 của họ.

Nên sử dụng bảng định dạng样式 (CSS) để định nghĩa布局 và thuộc tính hiển thị của phần tử HTML.

Các ví dụ khác

Hình nền có khả năng sử dụng mạnh
Ví dụ về hình nền và màu văn bản làm cho văn bản trên trang dễ đọc
Hình nền có khả năng sử dụng mạnh 2
Ví dụ khác về hình nền và màu văn bản làm cho văn bản trên trang dễ đọc
Hình nền có khả năng sử dụng kém
Ví dụ về hình nền và màu văn bản làm cho văn bản trên trang khó đọc