톱니 모양의 CFF 글꼴

Question

내 페이지에 CFF 글꼴을 사용하고 있지만 브라우저에 톱니가 보이고 있습니다. 여기

당신이 볼 수있는 방법 나는 그것을 사용하고 있습니다 : JSfiddle

HTML

body{ 
    font-size: 10px; 
} 

@font-face { 
    font-family: Planer_ExtraLight; 
    src: url('http://www.digitalpersone.com.br/projetos/fonts/planer_extralight.svg#Planer_ExtraLight') format('svg'), 
     url('http://www.digitalpersone.com.br/projetos/fonts/Planer_ExtraLight.otf'), 
     url('http://www.digitalpersone.com.br/projetos/fonts/Planer_ExtraLight.eot'); 
} 

p{ 
    font-family: Planer_ExtraLight; 
    font-size: 4em; 
} 

누군가가 나를 도울 수

<p>Hello everyb@dy!</p> 

CSS?

Answer 1

이 작동합니다 : http://jsfiddle.net/Allendar/aKGam/1/

p { 
    font-family: Planer_ExtraLight; 
    font-size: 4em; 
    font-smooth: subpixel-antialiased; 
    -webkit-font-smoothing: subpixel-antialiased; 
} 

결과

업데이트

가 MDN을 확인합니다. 그것은 대부분의 브라우저에서 작동하지 않는 것 같습니다. 다른 브라우저에서 -webkit-font-smoothing의 유사한 기능을 살펴보고 스타일에 추가 할 수 있습니다.

Safari에서 볼 수있는 품질 향상은 엄청납니다.

나는이 파이어 폭스에서 작동 할 수 있습니다 발견

2 업데이트;

browser.display.auto_quality_min_font_size = 0; // default = 20 

.. 여기서 lower는 품질이 좋고 렌더링 속도가 느리며 그 반대의 경우도 마찬가지입니다.

이 흥미도 3

업데이트 (https://developer.mozilla.org/en-US/docs/CSS/text-rendering);

text-rendering: geometricPrecision;