Dato un elemento <img>
, è possibile pixelare l'immagine utilizzando solo CSS e/o non utilizzare la tela? Ho visto cose come la funzione crisp edges (ma è solo per le immagini ridimensionate) e molte opzioni di tela, ma spero in un modo migliore.È possibile pixelare un'immagine senza tela?
risposta
È possibile ottenere un effetto pixel utilizzando la regola CSS image-rendering: pixelated;
e ridimensionando un'immagine - see this article.
Quindi, se voglio mantenere l'immagine alle sue dimensioni naturali, cosa suggeriresti? Ridimensionandolo, applicando il 'image-rendering', e quindi ridimensionandolo alla sua dimensione originale? O c'è un modo più semplice? –
Ciò funzionerebbe anche se dovessi ritagliare parte dell'immagine (sebbene sia pixelata). Puoi anche provare a salvare l'immagine sorgente in una dimensione più piccola di quella che effettivamente ti serve per apparire sul tuo sito, applicare 'image-rendering: pixelate;', e ridimensionarla alla dimensione desiderata. – Donald
Sì, questo è il problema, non avrò il controllo sulle immagini visualizzate, quindi non posso semplicemente salvarlo a una dimensione più piccola. –
Questa non sembra una richiesta per una risorsa. Sta chiedendo le tecniche CSS. – isherwood
La domanda è perfettamente valida. 'image-rendering: pixelated;' https://developer.mozilla.org/en/docs/Web/CSS/image-rendering – Pogrindis