Come applicare gli effetti anti-alias dei font nei CSS?

Question

Come possiamo applicare l'anti-alias dei caratteri di tipo Photoshop come nitido, nitido, forte, scorrevole nei CSS?

Sono supportati da tutti i browser?

Answer 1

qui si va Sir :-)

.myElement{ 
    -webkit-font-smoothing: antialiased; 
    } 

.myElement{ 
    -webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px; 
    } 

Update: (vedi Duke)

.myElement{ 
    text-shadow: rgba(0,0,0,.01) 0 0 1px; 
    } 

Answer 2

Risposta breve: non è possibile.

I CSS non hanno tecniche che influenzano il rendering dei caratteri nel browser; solo il sistema può farlo.

Ovviamente, la nitidezza del testo può essere facilmente ottenuta con schermi a densità di pixel, ma se si utilizza un PC normale sarà difficile da ottenere.

Ci sono alcuni tipi di carattere più recenti che sono lisci ma al sacrificio appaiono leggermente sfocati (per esempio, guarda la maggior parte dei font di Adobe). È tuttavia possibile trovare alcuni tipi di carattere uniformi ma sfocati a Google Fonts.

Esistono alcune nuove tecniche CSS3 per il rendering dei caratteri e gli effetti di testo, anche se la coerenza, le prestazioni e l'affidabilità di queste tecniche variano così ampiamente al punto che in genere non si dovrebbe fare troppo affidamento su di esse.

Answer 3

funziona meglio. Se si desidera utilizzarlo in tutto il sito, senza dover aggiungere questa sintassi per ogni classe o ID, aggiungere il seguente CSS per il vostro corpo css:

body { 
    -webkit-font-smoothing: antialiased; 
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004); 
    background: url('./images/background.png'); 
    text-align: left; 
    margin: auto; 

}