이유는이 구문 오히려 WOFF보다는 크롬로드 TTF 파일은,

Question

.CSS

@font-face { 
    font-family: 'NanumBarunGothic'; 
    src: url(NanumBarunGothic.eot); 
    src: url(NanumBarunGothic.eot?#iefix) format(‘embedded-opentype’), 
    url(NanumBarunGothic.woff) format(‘woff’), 
    url(NanumBarunGothic.ttf) format('truetype'); 
} 
@font-face { 
    font-family: 'NanumBarunGothic'; 
    src: url(NanumBarunGothicBold.eot); 
    src: url(NanumBarunGothicBold.eot?#iefix) format(‘embedded-opentype’), 
    url(NanumBarunGothicBold.woff) format(‘woff’), 
    url(NanumBarunGothicBold.ttf) format('truetype'); 
    font-weight: bold; 
} 

htaccess로

Addtype application/vnd.ms-fontobject .eot 
AddType font/ttf .ttf 
AddType font/otf .otf 
AddType application/font-woff .woof 

이 내 구문입니다. IE는 괜찮습니다. 완벽하게로드하십시오. 하지만 Safari, Chrome은 .ttf 글꼴을로드합니다. 왜? 잘못된 구문이 있습니까?

테스트 페이지 : http://parkjinho.pe.kr:2368

Answer 1

(왜 ') 문제 : WOFF가 파일

문제는 이다. Google 크롬 콘솔 로그를 확인하면 알 수 있습니다.

Failed to decode downloaded font: http://PATH_TO_YOUR_FONT/NanumBarunGothic.woff 
OTS parsing error: incorrect file size in WOFF header 

브라우저 기본값은 TTF 형식입니다. HTTP 요청을 확인하면 브라우저가 WOFF를 구문 분석 할 수없는 경우 WOFF 파일과 TTF 파일이 먼저 표시됩니다.

해결책 :

재 변환/는 WOFF 파일을 다시 생성. 거기에 대한 몇 가지 솔루션이 있습니다.

이

• 온라인 : http://ttf2woff.com/는
• 명령 줄 : https://github.com/ananthakumaran/webify으로 당신이 당신의 CSS 파일에 곱슬 따옴표있어 보이 테크 Surowka 지적

Answer 2

이 될 수

내가 사용하는 것이 좋습니다 문제를 일으킬 수 있습니다 (콘텐츠를 여기에 붙여 넣은 결과 일 수도 있음).

CSS에서 인용문을 사용하려면 또는 '을 사용해야합니다. “ ” ‘ ’.

또한 .woff 대신 .woof을 사용하고있는 파일에서 .htaccess 파일이 오타를 발견했습니다.