2012-11-22 4 views
3

Chrome, Safari, Firefox 및 IE에서 @ font-face를 사용하려고합니다. IE에서는 무엇을해야할지 모르지만 다른 브라우저에서는 @ font-face 부분을 사용하고 싶습니다.Firefox에서 @ font-face를 올바르게 렌더링하는 방법은 무엇입니까?

@font-face { 
    font-family: "Handwriter"; 
    src: url("/folder/Font-Regular.otf"); 
    } 

을 그리고 나는 또한 시도 :

는 여기에 내가 사용하고 무엇 이들 중 하나가 크롬과 사파리에서 제대로 렌더링하지만 파이어 폭스에서됩니다 사용

@font-face { 
font-family: "Handwriter"; 
src: url("http://www.domain.com/folder/Font-Regular.otf"); 
} 

. 재미있는 점은 Firebug를 사용하고 CSS 파일로 이동하여 다시 이름을 다시 작성하면 렌더링한다는 것입니다. 또한 글꼴 파일은 내 서버에 있으며 동일한 도메인에서이 파일을 축소합니다. 그래서 여기서 무엇이 잘못 될지 확실하지 않습니다.

+0

FontSquirrel 글꼴 얼굴 생성기 http://www.fontsquirrel.com/fontface/generator도 시도해 볼 수 있습니다. – Gus

+0

글꼴에 대한 URL이 Firefox에서 작동하려면 상대 경로 여야하며, 그렇지 않으면 서버를 구성 할 수 없습니다. o 그들에게 접근을 허용하라. –

답변

8

시도해보십시오 (사용자 정의 글꼴 사용). 형식을 기억하는 것이 중요합니다 :

@font-face { 
    font-family: 'WebFont'; 
    src: url('myfont.woff') format('woff'), /* Firefox 3.6+, IE9+, Chrome 6+, Safari 5.1+*/ 
     url('myfont.ttf') format('truetype'); /* Safari 3—5, Chrome4+, Firefox 3.5, Opera 10+ */ 
} 

소스 : 당신은 Z TTF 파일이있는 경우 나머지는 케이크 한 조각이다 D

내가 succefully : http://www.fontsquirrel.com/fontface 생성기를 사용 css3please

3

그것은 광고 아니다 :)

관련 문제