Funzione blur

La funzione blur permette di sfocare le immagini di sfondo secondo Gauss.

Sintassi

cssselettore {
  filter: blur(dimensione_sfocatura);
}

Esempio

Impostiamo una sfocatura di 2px per la nostra immagine:

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

css#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;
}

Результат:

Vedi anche

funzione brightness,
che imposta la luminosità dello sfondo
funzione contrast,
che imposta il contrasto dello sfondo
funzione drop-shadow,
che imposta l'ombra dello sfondo
funzione hue-rotate,
che imposta la tonalità di colore dello sfondo
funzione invert,
che inverte i colori dello sfondo
funzione opacity,
che imposta la trasparenza dello sfondo
funzione sepia,
che trasforma lo sfondo in seppia
proprietà background,
che è una proprietà abbreviata per lo sfondo
proprietà background-image,
con cui si può impostare un'immagine di sfondo per un blocco
proprietà filter,
che imposta lo stile per lo sfondo