Share
In questo suggerimento rapido ti mostrerò come applicare i CSS in base al motore di rendering del testo di ciascun browser.
Ecco il problema: a seconda del browser e del sistema operativo, il testo visualizzato dal browser verrà visualizzato in modo diverso. Ciò può essere problematico per i progettisti, in particolare quelli che si concentrano sul perfezionamento di dettagli tipografici come il carattere tipografico, la dimensione, il peso, la spaziatura e così via.
La stessa pagina mostrata in (da sinistra a destra) Chrome Mac OS, Internet Explorer, Microsoft EdgeSe miri a una maggiore coerenza dei tuoi progetti, una libreria JavaScript con il nome Type Rendering Mix vivendo le leggende della tipografia, Tim Brown e Bram Stein ti aiuteranno.
Questa libreria rileva il rasterizzatore di testo e il anti aliasing metodo utilizzato dal browser e aggiunge classi al html elemento per riflettere i risultati, ad esempio:
Nel nostro esempio sopra, potremmo voler ridurre il peso del blockquote in Chrome. Dopo aver caricato Type Rendering Mix nella pagina, un'ispezione rapida rivela che la classe tr-CoreText è stato applicato in Chrome, riflettendo il fatto che utilizza Core Text (Mac OS e iOS) per la rasterizzazione.
Potremmo quindi indirizzare in modo specifico il nostro testo più pesante aggiungendo una regola come questa al nostro CSS:
.tr-coretext blockquote font-weight: 300; // peso più leggero
Il Type Rendering Mix è stato intorno un certo numero di anni, ma è uno strumento semplice e solido, che offre un aiuto affidabile ai progettisti che vogliono modificare il modo in cui il loro tipo viene reso attraverso diversi browser.
Accentsconagua