사용자 정의 글꼴이 이상하게 표시됩니다.

처음부터 내가하려는 것은 "올바른 방법"이 아니라는 것을 알 필요가 있습니다. 그러나 필사적으로 노력하고있는 클라이언트는이 특정 글꼴을 원합니다.사용자 정의 글꼴이 이상하게 표시됩니다.

그래서 저는 VOGUE가 사용하는 정확한 글꼴을 클라이언트 웹 사이트에서 사용해야합니다. 그래서 ..ttf를 가져 와서 내 서버에 업로드했습니다. 그리고 나는 CSS 정의를 추가 : 일반적으로, 나는 모든 매력처럼 작동 할 전망,

.post h1 { 
    display: block; 
    height: 100%; 
    font-family: VogueDidot; 
    font-size: 55px; 
    text-transform: uppercase; 
    overflow: hidden; 
    line-height: 58px; 
}

그리고 :

/*fonts fonts for IE*/ 
@font-face { 
    font-family: VogueDidot; 
    src: url('font/FBDidotL-Regular.eot') format('embedded-opentype'); 
    font-weight: normal; 
    font-style: normal; 
} 

@font-face { 
    font-family: "VogueDidot Light"; 
    src: url('font/FBDidotL-Light.eot') format('embedded-opentype'); 
    font-weight: normal; 
    font-style: normal; 
} 

/*fonts for other browsers*/ 
@font-face { 
    font-family: VogueDidot; 
    src: url('font/FBDidotL-Regular.ttf') format('truetype'); 
    font-weight: normal; 
    font-style: normal; 
} 

@font-face { 
    font-family: "VogueDidot Light"; 
    src: url('font/FBDidotL-Light.ttf') format('truetype'); 
    font-weight: normal; 
    font-style: normal; 
}

그리고 내 요소에 대한 CSS입니다.

하지만 그렇지 않은 ... 여기

은 같아야하는 방법은 다음과 같습니다

enter image description here

그리고 그게 내 웹 사이트에 보이는 방법은 다음과 같습니다

enter image description here

어떤 아이디어 ?

출처

2013-03-23 chris_so

링크가 있습니까? 해당 페이지에 iframe이 있습니까? 내게 같은 문제가 발생했습니다 .... – hjuster

좋은 글꼴 변환기를 사용하여 모든 주요 브라우저를 지원하고 싶습니다. 시도 fontsquirrel.com –

@hjuster 불행히도 나는 지금 로컬 서버에있다 : ( –

브라우저가 글꼴을 굵게 표시하고 회색 픽셀 (가는 선에서)을 서로 반복하여 표시하는 것처럼 보입니다. font-weight: normal을 사용해보십시오 (font-weight:bold은 h1 요소에서 상속 됨).

출처

2013-03-23 13:52:41 darthmaim

'font-weight : bold' 설정은 상속 된 것이 아니라 대부분의 브라우저에서'h1'에 대한 기본 설정입니다. 그러나 기본 설명은 정확합니다 : 글꼴이 'normal'로 선언되고 CSS (브라우저 기본 스타일 시트,이 경우) '굵은 글꼴'요청, 브라우저는 알고리즘 볼링을 사용할 수 있습니다. –

감사합니다! –

사용자 정의 글꼴이 이상하게 표시됩니다.

답변

관련 문제