글꼴 얼굴 작업을 수행 할 수 없습니다.

Question

@font-face을 사용하려고하는데 아주 성공적이지는 않습니다. 지금까지, 내가 사용하고 최대 구글 글꼴 :

// HTML header 
<link href='http://fonts.googleapis.com/css?family=Cuprum' rel='stylesheet' type='text/css'> 

//CSS 
#leftSection nav { 
    font-family: "Cuprum", Verdana, Arial, sans-serif; 
} 

는 그럼 난 글꼴을 다운로드 font-face를 사용하여 시도 : 글꼴이있는

@font-face { 
    font-family: 'Cuprum'; 
    font-weight: normal; 
    font-style: normal; 
    font-size: 0.5em; 
    src: url('cuprum.eot?') format('eot'), 
     url('cuprum.woff') format('woff'), 
     url('cuprum.ttf') format('truetype'), 
     url('cuprum.svg#Cuprum') format('svg'); 
} 


#leftSection nav { 
    font-family: "Cuprum", Verdana, Arial, sans-serif; 
} 

:

이 내 CSS입니다 CSS와 동일한 폴더에 있습니다.

나는 다른 솔루션을 살펴 보았지만 아직 테스트 해 보지 못했습니다.

나는 다음과 같은 브라우저 테스트 해요 : FF7, IE8

을

나는이 적어도 글꼴 크기를 변경해야 font-size: 0.5em; 추가 한
업데이트. 그러나 그것은 일어나지 않습니다. 그래서 나는 전체 @font-face이 무시된다고 생각합니다.

Answer 1

글꼴 다람쥐 생성기를 사용해 보셨습니까? 글꼴을 업로드하면 모든 것이 자동으로 처리되므로 간단합니다. 난 당신이 "Cuprum" 주위에 따옴표없이 시도 할 수 있다고 생각 http://www.fontsquirrel.com/fontface/generator

Answer 2

: 여기

는 링크입니다.

#leftSection nav { 
    font-family: Cuprum, Verdana, Arial, sans-serif; 
} 

또한 사용자가 해당 글꼴을 로컬로 설치하면 문제가 발생할 수 있습니다.

이 문제를 해결하려면 가짜 local 참조를 설정할 수 있습니다.

1. 변화 글꼴 이름, cuprum를 소문자로 :

   당신이 시도 할 수 Paul Irish's Bulletproof @font-face syntax

   편집

   다른 두 가지를 참조하십시오.

   font-weight: normal; 
   font-style: normal; 
   font-size: 0.5em; 
   

Answer 3

안녕하세요 스티븐이 함께 완료 :

은 선언에서 다음을 제거? 왜이 기능을 사용해 보지 않으시겠습니까? 당신의 CSS를 내부

삽입이 :

@font-face { 
font-family: 'Cuprum'; 
font-style: normal; 
font-weight: normal; 
src: local('Cuprum'), url('http://themes.googleusercontent.com/static/fonts/cuprum/v1/sp1_LTSOMWWV0K5VTuZzvQ.woff') format('woff'); 
} 

#leftSection nav { 
font-family: Cuprum, Verdana, Arial, sans-serif; 
} 

나는 그것이 작동 바랍니다. :)