Utilizzando i CSS,Come sfocare Div Edges
come la seguente: http://gyazo.com/ff14a415cf7ac8622eb0cada3e23137f
voglio noi CSS (preferibilmente non CSS3) per ottenere i bordi e gli angoli di avere in tal senso, invece di appena affilato egdes.
È possibile ottenere questo effetto utilizzando un box-shadow lo stesso colore di sfondo del div, in questo modo:
.blur-box {
background-color: #555;
box-shadow: 0 0 5px 10px #555;
}
È possibile regolare il secondo e il terzo argomento (5px e 10px qui) di modificare la dimensione relativa e sfocatura raggio (rispettivamente) dell'ombra per ottenerlo nel modo desiderato, e questa funzione è ben supportata dai browser moderni (vedi: http://caniuse.com/#feat=css-boxshadow).
Ecco una demo jsFiddle: http://jsfiddle.net/bXAFt/
In ogni caso per farlo con i CSS originali e non con i CSS3? –
@OP CSS3 fa parte del CSS. Stai meglio a dirci quali browser vuoi supportare. Old IE ha filtri che possono essere usati come fallback. –
@JamesMitchell: il tuo effetto non è raggiungibile con i CSS <3. Dovresti davvero interessarti ai browser moderni per quanto riguarda la progettazione, mentre scrivi il tuo sito per supportare un degrado graduale/miglioramento progressivo. –
Quella è l'immagine (a meno che non si sta dicendo che è strettamente un esempio di look che si desidera). Se vuoi fare qualcosa di simile, dovresti cercare i bordi sfumati con i CSS, anche se sarebbe più facile usare box-shadow o un'immagine – ntgCleaner