Làm cách nào để xóa ảnh nền trong css?


192

Tôi có một quy tắc chung cung cấp cho tất cả các DIV hình ảnh nền.
Tôi có một div (với id = 'a') mà tôi không muốn nó có ảnh nền.
Tôi phải đưa ra quy tắc css nào?

Câu trả lời:


342

Thử:

div#a {
    background-image:none
}


3
"Tránh các bộ chọn tổ tiên không cần thiết là hữu ích vì lý do hiệu suất." Không thực sự là một vấn đề khi bạn không phải là Google.
Thưởng thức

Khuyến nghị của W3C về Bộ chọn CSS 3> Tính toán độ đặc hiệu của bộ chọn w3.org/TR/css3-selector/#specificity
TarranJones


30
div#a {
  background-image: none !important;
}

Mặc dù "! Quan trọng" có thể không cần thiết, vì "div # a" có độ đặc hiệu cao hơn so với chỉ "div".


Phần quan trọng là không cần thiết vì khai báo với #a chính xác hơn khai báo div và do đó quy tắc này sẽ được áp dụng thay vì quy tắc div chung.
Ruud

1
Tôi thấy! Điều quan trọng là cần thiết trong Chrome
dlchambers

17
div#a {
  background-image: url('../images/spacer.png');
  background-image: none !important;
}

Tôi sử dụng một hình ảnh spacer trong suốt ngoài quy tắc để loại bỏ hình nền vì IE6 dường như bỏ qua background-image: nonemặc dù nó được đánh dấu !important.


6
Ai quan tâm đến IE6 những ngày này.
Rob W

-1 Câu trả lời của bạn không chính xác. Tôi đã khởi động IE6 và background-image:none;(không có ot !important) hoạt động hoàn hảo.
Cướp

8
Trên thực tế, tôi quan tâm - một trong những khách hàng của tôi có môi trường mạng bị cô lập với một số phần mềm cụ thể chưa được cập nhật. IE6 là những gì họ phải sử dụng. Buồn nhưng là sự thật :(
Russ Clarke

5
Có một upvote để giảm thiểu downvote của Rob W. Anh ta khá thô lỗ khi chỉ hạ thấp khả năng tương thích ngược mà thậm chí không phải là hack, bất kể anh ta có thể tái tạo nó hay không
Kavi Siegel


2
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(0.5, #fff));
background-image: -webkit-linear-gradient(center top, #fff 0%, #fff 50%);
background-image: -moz-linear-gradient(center top, #fff 0%, #fff 50%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0);
background-image: linear-gradient(to bottom, #fff 0%, #fff 50%);

đối với các trình duyệt cũ hơn .. nếu bạn đã xác định css trong một số framewokrk.css như select2.css trong nền hình ảnh IE9: -webkit-gradient, v.v. và bạn muốn nó thông qua một .css khác viết lại bằng "hình nền: không! quan trọng" không làm việc. Tôi đã sử dụng cùng màu để chuyển màu như màu nền của trang.



1

Khi background-image: none !important;không có tác dụng. Bạn có thể dùng:

background-size: 0 !important;

0

Nó không hoạt động:

.clear-background{
background-image: none;
}

Có thể có vấn đề trên các trình duyệt cũ hơn ...


0

Thay thế quy tắc bạn có bằng cách sau:

div:not(#a) { // add your bg image here //}
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.