Как сделать bg-image чб?

Question

[Ingernirated]

Всем привет.
Подскажите, как можно повлиять на цветность картинки фона?
А именно, хочу сделать её черно-белой.

Answer 1

[Pavel Karinin]

Если разместить картинку как img на задний план, то очень просто:

img {
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
  filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
}

Comments

[Ingernirated]

Спасибо, а как сослаться только на фон?
Если задаю это родителю, то и все блоки внутри серые.
Мне нужно только фон сделать серым.

[Pavel Karinin]

К сожалению к именно background-image как к стилевому свойству нельзя применить filter, и других способов в CSS для этого нет. Поэтому используют именно тот рецепт, о котором я указал в своем ответе.