Задний размытый фон сайта одной строчкой?

Question

[frees2]

С праздником!
Придумал задний размытый фон, который можно привязать к любому существующему id. Хотелось бы услышать критику и предложения, так как пока в таком виде не встречал.
/pen/pVaRBX

Answer 1

[SeaW]

1. При чем здесь id, если в CSS вы его даже не используете, а в html он висит просто чтобы был?
2. height: 99999999px - треш, как и весь CSS одним комом.
3. В Firefox Developer ваш пример у меня не работал — поправил.
4. Эффект в вашем случае ничего интересного из себя не представляет.

Comments

[frees2]

Спасибо, так корректнее, но практика говорит, не надо 100% высоту, можно короче конечно...

[SeaW]

frees2, почему не 100%?

[frees2]

SeaW, фон меняется так, а если во фреймах или блоках, то не будет как надо.

[frees2]

4. Картинку вставить, и будет неравномерный фон.
Пример иной, жуткое решение, конечно...
https://paper-leaf.com/blog/2016/01/creating-blurr...
1. У меня id задействован, но тут у вас правильно, для примера он не нужен, так работает.

Answer 2

[Максим Тимофеев]

Придумал критику 1 ссылкой:
https://caniuse.com/#search=filter%3A%20blur

height:99999999px; - да ну не может быть. Да ну нах. Нет я не верю.

z-index: -100; а почему не z-index: -47;

Comments

[frees2]

Если блоки уже есть с - 1, а так надёжнее
height: если 100% то так неверно будет, при изменении размера

[Максим Тимофеев]

Если блоки уже есть с - 1, а так надёжнее

а если есть блоки с -101?

то так неверно будет, при изменении размера

почему? точнее, при чем тут изменение размера и изменение размера чего?

[frees2]

Максим Тимофеев, ну пускай -1, можно и 1, в частности, чтобы случайно не пересекалось.

[frees2]

Максим Тимофеев, так не корректно, считается, во вторых, попробуйте уменьшить поле, фон будет меняться.

[Максим]

Придумал критику 1 ссылкой:

тёска ты безупречен ! :))

[Максим Тимофеев]

frees2, а почему не сделать это градиентом?
https://codepen.io/wokster/pen/vjdxea

[frees2]

Максим Тимофеев, Потому, что можно фон делать из размытой картинки тоже. С картинкой (шум) будет красивее/

[frees2]

Максим Ленский, 1 % использует этот 11, к тому он развиваться не будет, заморожен, так уже все делают без оглядки на него.

[Максим Тимофеев]

frees2, тогда svg фильтр
https://habr.com/sandbox/88007/

[frees2]

Максим Тимофеев, https://paper-leaf.com/blog/2016/01/creating-blurr...
Получение текстур через размытость
Пример
https://codepen.io/ntan97/pen/QyyzBX

[frees2]

frees2, https://codepen.io/tallinn/pen/pVaRBX
не очень удачная картинка, там надо просто пиксели разбросать