Как не брать стиль от родителя?

Question

[Vindie]

Есть div, в котором должна размываться картинка, но в этим div есть текст, который не должен размываться, как это сделать?
HTML:

div align="center" id="fon-img-div"><h1>erueiehgiegh</h1></div>

CSS:

#fon-img-div{
background-image: url(imag/fon-img.jpg);
filter: blur(5px);
}

Answer 1

[Фин Дел]

ещё можно так сделать

Answer 2

[Богдан Ерольский]

Использовать похожую конструкцию

<div align="center" id="fon-img-div"><h1>Без эффекта</h1>
    <h2>С эффектом</h2></div>

#fon-img-div *:not(h1){
  filter: blur(2px);
}

Comments

[Vindie]

Спасибо, помогло, но теперь между этим div и предыдущим появилось расстояние, которое не убирается с помощью

padding: 0px;
  margin: 0px;

ни у самого div, ни у h1, h2