Hướng dẫn sử dụng CSS tạo hình nền full màn hình

Đoạn code css này sẽ giúp bạn tạo hình nền cho trang web, hình nền full toàn bộ trang, có thể xem được trên tất cả các thiết bị như mobile, tablet, desktop,v.v... Đoạn code này có gì đặc biệt?

  • Hình nền full toàn bộ, không khoảng trắng
  • Hình tự động co giãn khi bạn thay đổi kích thước màn hình
  • Giữ chất lượng hình nền luôn tốt
  • Hình luôn được đặt ở trọng tâm cửa sổ trình duyệt
  • Có thể chạy được trên mọi trình duyệt web

tao hinh nen full man hinh

# Cách CSS tạo hình nền cho trang web đẹp nhất

Chúng ta có thể thực hiện điều này hoàn toàn thông qua CSS nhờ thuộc tính kích thước nền trong CSS3. Mình sẽ sử dụng phần tử html (tốt hơn phần thân vì nó luôn luôn ít nhất là chiều cao của cửa sổ trình duyệt). Chúng ta đặt nền cố định và căn giữa trên đó, sau đó điều chỉnh kích thước của nó bằng cách sử dụng kích thước nền được đặt thành từ khóa bìa.

html {

background: url(images/bg.jpg) no-repeat center center fixed;

-webkit-background-size: cover;

-moz-background-size: cover;

-o-background-size: cover;

background-size: cover;

}

Đoạn code này có thể chạy trên:

  • Safari 3+
  • Chrome (tất cả phiên bản)
  • IE 9+
  • Opera 10+
  • Firefox 3.6+

MTHE


Ý kiến (0)

Tất cả các bình luận của bạn đều được ghi nhận, thông tin số điện thoại, email cá nhân sẽ được ẩn tự động. Chúng tôi sẽ kiểm duyệt trước khi đưa lên website


Chưa có ý kiến nào, hãy là người đầu tiên.

Thiết Kế Website MThe
034 244 0080