web-dev-qa-db-fra.com

-webkit-font-smoothing n'a aucun effet dans Chrome

J'essaie de contrôler l'anti-aliasing des polices (horribles) de Google Chrome à l'aide de la propriété CSS -webkit-font-smoothing, mais cela n'a absolument aucun effet sur le texte.

<div style="font-size: 42px">
  <p style="-webkit-font-smoothing: subpixel-antialiased">This is a font test.</p>
  <p style="-webkit-font-smoothing: antialiased">This is a font test.</p>
  <p style="-webkit-font-smoothing: none">This is a font test.</p>
</div>

J'ai comparé les pixels dans Photoshop et les trois sont exactement les mêmes. Chrome ne prend-il plus en charge cette propriété?

cssgoogle-chromefonts
11
Gavin

https://productforums.google.com/forum/?fromgroups=#!topic/chrome/0vqp1bnkaoE

-webkit-font-lissage ne fonctionne plus. L'équipe Google Chrome a intentionnellement modifié ce comportement. Il semble que le lissage des polices n'ait pas été appliqué "correctement" sur OSX dans les versions précédentes.

15
BenM

Eh bien, vous avez raison. Le lissage des polices n’est plus pris en charge. Ce n’est pas dans les nouvelles normes CSS. Donc, plus besoin de lisser les polices.! Vous voudrez peut-être voir les normes W3c ici. http://www.w3.org/TR/WD-font/#font-smooth

0
Jayesh Amin

Il semble que pour certaines polices (système?), Il existe une différence entre vos cas de test:

body {
   font-family: "HelveticaNeue-Light";
   font-weight: 300;
}

http://jsfiddle.net/gN875/

0
tinynow

Vous pouvez essayer syntax: 

/* Keyword values */
font-smooth: auto;
font-smooth: never;
font-smooth: always;

/* <length> value */
font-smooth: 2em;

Bien que présent dans les versions préliminaires (2002) des polices CSS3, font-smooth a été supprimé et cette spécification n’est pas sur la voie des normes. https://developer.mozilla.org/en-US/docs/ Web/CSS/font-smooth

0
Rizo

Essayez ce CSS:

div {
  -webkit-text-stroke: 0.6px;
}
<div style="font-size: 42px">
  <p style="-webkit-font-smoothing: subpixel-antialiased">This is a font test.</p>
  <p style="-webkit-font-smoothing: antialiased">This is a font test.</p>
  <p style="-webkit-font-smoothing: none">This is a font test.</p>
</div>

0
Gener Cruz

Si vous utilisez un navigateur ou un système d'exploitation ne disposant pas du rendu de la police, cela ne fonctionnera pas. Avez-vous déjà essayé -moz--o-, Chrome fonctionne sur -webkit- et il doit s'agir de votre navigateur.

0
internetgho5t