Come rimuovo l'immagine di sfondo in CSS?

192

Ho una regola generale che dà a tutti i DIV un'immagine di sfondo.
Ho un div (con id = 'a') che non voglio che abbia l'immagine di sfondo.
Quale regola CSS devo dare?

html css

— Itay Moav -Malimovka
fonte

342

Provare:

div#a {
    background-image:none
}

— AnthonyWJones
fonte

13

Basta usare #a {}. Non usare tipi di elementi nei selettori se non necessario .

— Jezen Thomas,

3

"Evitare selettori di antenati non necessari è utile per motivi di prestazioni." Non è davvero un problema quando non sei Google.

— Davor

Raccomandazione del W3C sui selettori CSS 3> Calcolo della specificità di un selettore w3.org/TR/css3-selectors/#specificity

— TarranJones

34

div#a {
    background-image: none;
}

— Ruud
fonte

30

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

Anche se "! Important" potrebbe non essere necessario, perché "div # a" ha una specificità superiore rispetto a "div".

— M4N
fonte

La parte! Importante non è necessaria poiché la dichiarazione con #a è più precisa di una dichiarazione di div e pertanto questa regola verrà applicata al posto della regola di div generale.

— Ruud,

1

Ho trovato! Importante essere necessari in Chrome

— dlchambers il

17

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

Uso un'immagine spaziatore trasparente oltre alla regola per rimuovere l'immagine di sfondo perché IE6 sembra ignorare background-image: noneanche se è contrassegnato !important.

— MatthewPearson
fonte

6

Chi se ne frega di IE6 in questi giorni.

— Rob W,

-1 La tua risposta è errata. Ho iniziato IE6 e il background-image:none;(con ot senza !important) funziona perfettamente.

— Rob W

8

In realtà, mi interessa: uno dei miei clienti ha un ambiente di rete isolato con alcuni software specifici che non sono stati aggiornati. IE6 è quello che devono usare. Triste ma vero :(

— Russ Clarke,

5

Avere un voto per mitigare il voto di Rob W. Era abbastanza scortese da parte sua votare per la compatibilità all'indietro che non è nemmeno un hack, indipendentemente dal fatto che potesse riprodurlo o no

— Kavi Siegel,

8

Poiché in css3 è possibile impostare più immagini di sfondo impostando "nessuna" si creerà solo un nuovo livello e non si nasconderà nulla.

http://www.css3.info/preview/multiple-backgrounds/ http://www.w3.org/TR/css3-background/#backgrounds

Non ho ancora trovato una soluzione ...

— Sono io
fonte

Credo "background: none;" sovrascriverà

— circusdei il

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%);

per i browser più vecchi .. se hai definito css in alcuni framewokrk.css come select2.css in IE9 background-image: -webkit-gradient ecc. e lo vuoi tramite un altro .css riscrivi con "background-image: none! important" non funziona. Ho usato lo stesso colore per sfumare il colore come il colore di sfondo della pagina.

— Buts
fonte

1

Se la tua regola div è giusta div {...}, allora #a {...}sarà sufficiente. Se è più complicato, è necessario un selettore "più specifico", come definito dalla specifica CSS sulla specificità . (#a essere più specifico di div è solo un singolo aspetto dell'algoritmo.)

— Solo innamorato
fonte

1

Quando background-image: none !important;non hanno alcun effetto. Puoi usare:

background-size: 0 !important;

— Michał Szymański
fonte

0

Non funziona:

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

Potrebbe avere problemi con i browser più vecchi ...

— Ben Hall
fonte

0

Sostituisci la regola che hai con la seguente:

div:not(#a) { // add your bg image here //}

— circusdei
fonte