2017-02-24 1 views
1

블로거 웹 사이트에 글꼴을 포함 시키려고했지만 해당 PC에 글꼴이 설치되어 있지 않은 다른 PC에서 글꼴을 테스트했을 때 작동하지 않았습니다.블로거에 내 글꼴을 포함시키는 방법은 무엇입니까?

이 내 블로그 주소입니다 : ann24h.com

내 글꼴이 다른 호스팅에서 찾을 수 있습니다 : 내 CSS를 해결하는 방법 http://kesor168.com/sub/font/

<style> 
@font-face { 
font-family: Khmer OS Dangrek; 
src: url(http://kesor168.com/sub/font/Khmer_OS_Dangrek.eot); 
src: url(http://kesor168.com/sub/font/Khmer_OS_Dangrek.ttf); 
} 
@font-face { 
font-family: Khmer OS Battambang; 
src: url(http://kesor168.com/sub/font/Khmer_OS_Battambang.eot); 
src: url(http://kesor168.com/sub/font/Khmer_OS_Battambang.ttf); 

} 
</style> 

어떤 생각을?

답변

1

올바른 구문을 사용하려면 이름 값 쌍이 필요합니다. font-family 속성하지 Example Font Name

당신은 현재 만 .eot.ttf 글꼴 파일이 "Example Font Name" (단일 또는 이중 따옴표를 괜찮)이 필요합니다. Android 또는 iOS에서 IE9 및 Safari 만 지원합니다. .eot 파일에 대한 IE 수정 사항이있는 경우 IE6 - IE8에 대한 지원을받을 수 있습니다.

@font-face { 
    font-family: 'Khmer OS Battambang'; 
    src: url('http://kesor168.com/sub/font/Khmer_OS_Battambang.eot'); 
    src: url('http://kesor168.com/sub/font/Khmer_OS_Battambang.eot?#iefix') format('embedded-opentype'), 
     url('http://kesor168.com/sub/font/Khmer_OS_Battambang.ttf') format('truetype') 
} 

는 전체 페이지에 적용하려면 : 나는 위의 하나의 예를

html, body { 
    font-family: 'Khmer OS Battambang', sans-serif; 
} 

, 당신은 쉽게 예를 사용하여 다른 글꼴 얼굴을 만들 수 있습니다.


편집 : 당신은 당신이 구글 크롬 대답에 일하는 것이 그렇게 추가 할 것입니다 무슨 라인 질문 :

url('Khmer_OS_Battambang.woff2') format('woff2'), 
url('Khmer_OS_Battambang.woff') format('woff'), 

'woff2'아래의 두 줄을 추가 정말 새로운 현대적인 브라우저에 적용됩니다.
'비웃음'은 일반적으로 최신 브라우저에 적용됩니다.

물론 다른 글꼴과 동일한 디렉토리에 .woff.woff2 개의 파일이 있어야합니다. 또한 필자가 제공 한 예제에서 파일 만 지정 했으므로 디렉토리를 지정해야합니다.

+0

Google 크롬을 지원해야하는 경우 무엇을 추가해야합니까? –

+0

현대적인 브라우저로 분류 된 Google 크롬에 대한 지원을 추가 할 수 있도록 내 답변을 편집했습니다. –

관련 문제