CSS3 글꼴 포함

Question

나는 단순히 내 서버에 업로드 한 글꼴을 포함하려고합니다.

모두 제대로로드되고 있지만 잘못된 글꼴이 표시됩니다. @ font-face 코드를 제거하면 렌더링 된 HTML 글꼴이 변경되기 때문에 이런 현상이 발생합니다.

다음은 내 코드입니다. 지난 한 시간 동안 여러 가지로 놀아 보았습니다. 나는 또한 .TTF 파일을 시도했다.

@font-face { 
    font-family: Joan; 
    src: url("../fonts/joan.otf") format('font/opentype'); 
} 
body { 
    background: url('../images/bg.gif'); 
    font-family: Joan; 
} 

Answer 1

글꼴 이름을 따옴표로 묶어야 할 수도 있습니다. 또한 MSIE 호환성을 위해 글꼴을 .eot 형식으로 변환해야합니다. 여기에 "bulletproof"@ font-face가 per paulirish.com으로 있습니다. 당신은 전체/포스트 스크립트 글꼴 이름에 따라 조정해야 할 수도 있습니다 :

@font-face { 
    font-family: 'Joan'; 
    src: url('../fonts/joan.eot'); 
    src: local('Joan Regular'), local('Joan'), 
     url('../fonts/joan.otf') format('opentype'); 
} 

Answer 2

http://www.fontsquirrel.com/fontface/generator

승리를 나를 위해 지금까지 내 관련 모험이다.

Here's a website 내가 함께 개발하고 있어요 우리가 말하는 : 당신이 사용하는 어떤 브라우저 http://bigballoon.businesscatalyst.com/