Как удалить фоновое изображение в CSS?

195

У меня есть общее правило, которое дает всем DIV фоновое изображение.
У меня есть один div (с id = 'a'), который не должен иметь фоновое изображение.
Какое правило css я должен дать ему?

html css

— Итай Моав -Малимовка
источник

349

Пытаться:

div#a {
    background-image:none
}

— ЭнтониУ Джонс
источник

13

Просто используйте #a {}. Не используйте типы элементов в селекторах без необходимости .

— Jezen Thomas

3

«Избегание ненужных селекторов предков полезно по соображениям производительности». Это не проблема, если вы не Google.

— Давор

Рекомендация W3C по селекторам CSS 3> Расчет специфичности селектора w3.org/TR/css3-selectors/#specificity

— TarranJones

36

div#a {
    background-image: none;
}

— Рууд
источник

31

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

Хотя "! Important" может не понадобиться, потому что "div # a" имеет более высокую специфичность, чем просто "div".

— M4N
источник

Часть! Important не требуется, поскольку объявление с #a более точное, чем объявление div, и поэтому это правило будет применяться вместо общего правила div.

— Рууд,

2

Я обнаружил, что! Важно быть необходимым в Chrome

— dlchambers

17

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

Я использую прозрачное изображение-разделитель в дополнение к правилу для удаления фонового изображения, потому что IE6, похоже, игнорирует, background-image: noneдаже если он отмечен !important.

— Мэтью Пирсон
источник

6

Кого волнует IE6 в наши дни.

— Rob W

-1 Ваш ответ неверен. Я запустил IE6, и он background-image:none;(без него !important) работает безупречно.

— Роб У

8

На самом деле меня волнует - у одного из моих клиентов есть изолированная сетевая среда с каким-то конкретным программным обеспечением, которое не обновлялось. IE6 - это то, что им нужно использовать. Печально, но факт :(

— Расс Кларк

5

Проголосуйте, чтобы смягчить голос Роба В. Было довольно грубо с его стороны проголосовать против только из-за обратной совместимости, которая даже не является взломом, независимо от того, может он воспроизвести это или нет,

— Кави Сигел

8

Поскольку в css3 можно установить несколько фоновых изображений, установка «none» только создаст новый слой и ничего не скроет.

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

Пока не нашел решения ...

— Это я
источник

Я считаю, что «фон: нет»; будет переопределить

— circusdei

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

для старых браузеров ... если вы определили css в каком-то framewokrk.css, например select2.css в IE9 background-image: -webkit-gradient и т. д., и вы хотите его через другой .css перезаписать с "background-image: none! important" не работает. Я использовал тот же цвет для цветового градиента, что и цвет фона страницы.

— буЦ
источник

2

Когда background-image: none !important;не действуют. Ты можешь использовать:

background-size: 0 !important;

— Михал Шиманский
источник

1

Если ваше правило div справедливо div {...}, этого #a {...}будет достаточно. Если это более сложно, вам понадобится «более конкретный» селектор, как определено спецификацией CSS для специфичности . (#a более конкретный, чем div, это всего лишь один аспект в алгоритме.)

— Только в любви
источник

0

Не работает:

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

Могут возникнуть проблемы в старых браузерах ...

— Бен Холл
источник

0

Замените имеющееся у вас правило следующим:

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

— цирк
источник