Sto utilizzando il css transform:scale per ridimensionare alcuni elementi e ora i bordi, che erano originariamente 1px solid black, ottengono alcuni rendering subpixel - 'antialiasing' - poiché ora sono 1.4px o qualcosa del genere. Esattamente come appare dipende dal browser, ma è sfocato su tutti i browser moderni.disable aliasing subpixel sui bordi html/css
Posso disabilitare il rendering subpixel per determinati elementi?
È possibile controllare l'antialiasing del testo su WebKit con questo css: -webkit-font-smoothing: antialiased; E a volte forzando l'accelerazione 3d con qualcosa del tipo: -webkit-transform: translate3d (0, 0, 0); aiuta anche l'aliasing (almeno quando si usa ruotare nella mia esperienza).
Grazie e corretto, ma stavo chiedendo effetti di aliasing sugli elementi non di testo, in particolare i bordi. questi non sono influenzati da '-webkit-font-smoothing' e il trucco translateZ non ha avuto alcun effetto ... – commonpike
È sfocato perché le visualizzazioni standard di 72 dpi non possono rendere le dimensioni dei pixel frazionari, come sicuramente comprenderete. Inoltre, c'è nothing within the spec per influenzare il rendering o l'aliasing dei bordi.
Una larghezza in pixel pari a 2 può dare risultati migliori, ma praticamente tutto sfocherà.
Alcuni dispositivi e display retina supportano sub-pixel border widths ma non ci sono soluzioni coerenti quando si tratta di supporto cross-browser.
Nel mio test, ho trovato risultati migliori durante il ridimensionamento da un angolo, al contrario del centro per impostazione predefinita. Oltre ad aumentare di un quarto o metà.
transform: scale(1.25);
transform-origin: left top;
soluzioni specifiche per il browser - ad esempio CSS con prefissi vendor - sono i benvenuti – commonpike
... se si utilizza una regola CSS per trasformare/scalare gli elementi, perché non solo regolare i confini in questa stessa regola ??? – Cholesterol
Avrei dovuto dire che la bilancia era dinamica, fatta con javascript. Non ho provato a regolare la larghezza del bordo con lo stesso javascript, ad es. Larghezza del bordo: 0.71px o qualcosa del genere, potrebbe essere stata una soluzione. – commonpike