Home / Hỏi đáp / background-size cover là gì Background-Size Cover Là Gì 06/11/2021 background-colornằm trong tính background-color dùng làm đặt màu nền cho một nhân tố. Nó đồng ý toàn bộ quý giá các mã color hoặc nằm trong tính transparentvd:.left background-color: #ffdb3a; .middle background-color: #67b3dd; .right background-color: transparent; Màu nền được khẳng định trong số ô được xác định vày nằm trong tính background-clip. Nếu tất cả ảnh nền được đặt thuộc thì lớp màu sắc sẽ tiến hành đặt ở bên dưới. Không y hệt như những lớp hình ảnh hoàn toàn có thể áp dụng các lớp, bọn chúng chỉ hoàn toàn có thể cần sử dụng được một tấm màu sắc cho 1 nguyên tố.Bạn đang xem: Background-size cover là gìbackground-imageThuộc tính background-image định nghĩa mang đến màn hình của một nhân tố. Nó là cực hiếm được định nghĩa bởi một băng thông hình hình ảnh với ký hiệu url(). Giá trị non hoàn toàn có thể được sử dụng, nó được xem là một trong lớp.vd:.left background-image: url("ire.png"); .right background-image: none; Chúng ta có thể thực hiện các ảnh trên nền, mỗi quý giá được bí quyết nhau vì chưng một lốt phẩy. Mỗi hình hình ảnh tiếp theo sẽ tiến hành đặt trước bên trên trục z.vd:.middle background-image: url("khaled.png"), url("ire.png"); /* Other styles */ background-repeat: no-repeat; background-size: 100px;background-repeatThuộc tính background-repeat kiểm soát điều hành phương pháp hình nền sau khi nó được đặt size (bởi ở trong tính background-size) cùng địa chỉ (vày thuộc tính background-position).Giá trị của của nằm trong tính này rất có thể là 1 giữa những từ bỏ khóa sau: repeat-x, repeat-y, repeat, space, round, no-repeat. Bên cạnh nhị ở trong tính repeat-x cùng repeat-y, các quý giá không giống hoàn toàn có thể được khái niệm một lượt cho tất cả nhì trục x và trục y hoặc từng chiều riêng biệt.vd: .top-outer-left background-repeat: repeat-x; .top-inner-left background-repeat: repeat-y; .top-inner-right background-repeat: repeat; .top-outer-right background-repeat: space; .bottom-outer-left background-repeat: round; .bottom-inner-left background-repeat: no-repeat; .bottom-inner-right background-repeat: space repeat; .bottom-outer-right background-repeat: round space; background-sizeThuộc tính background-kích cỡ quan niệm form size của ảnh nền. Giá trị của nó có thể là kích cỡ kích thước Hay những tỉ trọng phần trăm.Từ khóa có sẵn cho ở trong tính là contain với cover. Giá trị contain đang co dãn hình hình họa nhằm cân xứng cùng với size. quý giá cover, ở một mặt khác nó đang kéo dãn dài hình hình ảnh làm sao để cho vừa cùng với khung nhưng mà ko tạo xô lệch tỉ trọng.Xem thêm: Ad Trong Liên Quân Là Gì - Vai Trò Của Tướng Ad Trong Lqmbvd: .left background-size: contain; background-image: url("ire.png"); background-repeat: no-repeat;.right background-size: cover; /* Other styles same as .left */ Đối với những quý giá chiều dài với giá trị phần trăm, bạn có thể khẳng định cả chiều rộng lớn và chiều cao của ảnh trên nền. Tỷ lệ Tỷ Lệ giá trị được xem toán thù tương quan mang lại kích cỡ của bộ phận.vd:.left background-size: 50px; /* Other styles same as .left */ .right background-size: 1/2 80%; /* Other styles same as .left */ background-attachmentThuộc tính background-attachment dùng làm kiểm soát và điều hành nền game tương quan cho các cơ thể và các yếu tắc. Nó tất cả tía quý giá là: fixec, local, scroll.Fixed nghĩa là hình ảnh nền được cố định và thắt chặt vào form quan sát cùng không di chuyển, trong cả khi người dùng sẽ dịch rời dọc theo size.Local là ảnh trên nền đề nghị được thắt chặt và cố định vào vị trí của nó trong bộ phận. Nếu bộ phận tất cả một nguyên tắc di chuyển và màn hình được đặt lên trên hàng đầu, Khi người dùng cuộn xuống bộ phận, ảnh trên nền đã dịch chuyển thoát khỏi tầm chú ý.Scroll tức là những ảnh trên nền cố định và sẽ không còn di chuyển trong cả cùng với những văn bản của các bộ phận của nó.vd:.left background-attachment: fixed; background-size: 50%; background-image: url("ire.png"); background-repeat: no-repeat; overflow: scroll;.middle background-attachment: local; /* Other styles same as .left */ .right background-attachment: scroll; /* Other styles same as .left */ background-positionThuộc tính này là sự việc kết phù hợp với nằm trong tính background-origin, xác định địa điểm những địa chỉ bước đầu mang lại hình nền bắt buộc được. Đó là giá trị rất có thể là một trường đoản cú khóa, chiều lâu năm, hoặc một Tỷ Lệ Xác Suất, và Shop chúng tôi có thể xác xác định trí dọc theo trục x cũng tương tự những trục y.Từ khóa tất cả sẵn: top, right, bottom, left cùng center. Chúng ta rất có thể thực hiện các từ khóa trong ngẫu nhiên sự phối hợp, và trường hợp chỉ có một từ khóa được qui định.vd:.top-left background-position: top; background-size: 50%; background-image: url("ire.png"); background-repeat: no-repeat;.top-middle background-position: right; /* Other styles same as .top-left */ .top-right background-position: bottom; /* Other styles same as .top-left */ .bottom-left background-position: left; /* Other styles same as .top-left */ .bottom-right background-position: center; /* Other styles same as .top-left */ Đối với chiều nhiều năm cùng Tỷ Lệ tỷ lệ giá trị, chúng ta cũng có thể xác xác định trí dọc theo trục x với trục y. Tỷ lệ Tỷ Lệ quý giá là tương quan mang lại những yếu tố gồm cất.vd:.left background-position: 20px 70px; /* Others same as .top-left */ .right background-position: 50%; /* Others same as .top-left */ background-originThuộc tính background-origin vẻ ngoài rõ ràng trong số đó diện tích S những quy mô vỏ hộp ảnh trên nền cần được sắp xếp theo.Giá trị mặc định là border-box, Lúc cơ mà vị trí hình hình họa sinh hoạt sát viền của khung, padding-box Khi nhưng hình hình họa nghỉ ngơi vào viền của khung và content-box lúc mà lại hình hình ảnh sống vào khungvd: .left background-origin: border-box; background-size: 50%; background-image: url("ire.png"); background-repeat: no-repeat; background-position: top left; border: 10px dotted black; padding: 20px;.middle background-origin: padding-box; /* Other styles same as .left*/ .right background-origin: content-box; /* Other styles same as .left*/ background-clipThuộc tính background-clip xác minh khoanh vùng sơn nền, chính là Khu Vực nhưng mà nền rất có thể đánh lên, giống hệt như background-origin, nó được dựa trên các lĩnh vực mô hình vỏ hộp.vd:.left background-clip: border-box; background-size: 50%; background-color: #ffdb3a; background-repeat: no-repeat; background-position: top left; border: 10px dotted black; padding: 20px;.middle background-clip: padding-box; /* Other styles same as .left*/ .right background-clip: content-box; /* Other styles same as .left*/