Funkce blur

Funkce blur umožňuje rozostřit pozadí obrázků podle Gausse.

Syntaxe

selektor {
	filter: blur(velikost rozostření);
}

Příklad

Nastavme našemu obrázku rozostření 2px:

<div id="elem"></div>

#elem {
	filter: blur(2px);
	background-blend-mode: normal;
	background: url("bg.png") center / cover no-repeat,
	linear-gradient(#00A8DE, #FFF) fixed;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

Viz také

funkce brightness,
která nastavuje jas pozadí
funkce contrast,
která nastavuje kontrast pozadí
funkce drop-shadow,
která nastavuje stín pozadí
funkce hue-rotate,
která nastavuje barevnost pozadí
funkce invert,
která invertuje barvy pozadí
funkce opacity,
která nastavuje průhlednost pozadí
funkce sepia,
která převádí pozadí na sépii
vlastnost background,
která představuje zkratkovou vlastnost pro pozadí
vlastnost background-image,
pomocí které lze bloku nastavit obrázek na pozadí
vlastnost filter,
která nastavuje styl pro pozadí