CSS 글꼴 다람쥐가 제대로 적용되지 않음

글꼴 다람쥐의 글꼴 두 개를 사용하여 내 워드 프레스 위젯 영역의 일부 스타일을 지정하고 있습니다 (Gothic 및 Playfair Display). 그러나 어떤 이유로 Playfair만이 적용되고 Gothic은 무시되고 있습니다. 실제로 HTML을 표시하지만, 기본적으로 다음과 같은 기운의 워드 프레스 위젯 영역 때문에 다시 한 종류의 글꼴 작동하는 CSS 코드 :CSS 글꼴 다람쥐가 제대로 적용되지 않음

CSS :

@font-face{ 
    font-family: 'Playdisplay'; 
    src: url('font/PlayfairDisplay-Bold.ttf') format('ttf'), 
    url('font/PlayfairDisplay-BlackItalic.ttf') format('ttf'), 
    url('font/PlayfairDisplay-BoldItalic.ttf') format('ttf'), 
    url('font/PlayfairDisplay-Italic.ttf') format('ttf'), 
    url('PlayfairDisplay-Regular.ttf') format('ttf'), 
    url('font/PlayfairDisplay-black.ttf') format('ttf'); 
font-weight: normal; 
font-style: normal;  
} 
@font-face{ 
    font-family: 'Goth'; 
    src: url('font/GOTHIC.ttf') format('ttf'), 
     url('font/GOTHICB.ttf') format('ttf'), 
     url('font/GOTHICBI.ttf') format('ttf'), 
     url('font/GOTHICI.ttf') format('ttf'); 
    font-weight: normal; 
    font-style: normal; 
} 

.mainfooter h3{ 
    font-family: Goth, GOTHIC; 
} 

footer h1, 
footer h2, 
footer h3{ 
    font-family: Playdisplay, PlayfairDisplay-Bold; 
}

가 어떻게 두 글꼴을 사용하고 적용 할 수 있습니다 사이트 어디서나?

출처

2016-07-11 Wosley Alarico

문제는 글꼴 파일에 대한 링크 일 것입니다. 글꼴 파일의 위치를 CSS 파일에 확인해야합니다. 이제는 CSS 파일 옆의 CSS 폴더 안에 글꼴 폴더가 있습니다. 또한 왜 같은 포맷을 4 개 이상 보유하고 있습니까? 'WOFF' 나 다른 형식을 적용하지 않는다면, 한 번만하면됩니다. – Andrew

모든 형식을 삭제했습니다. 고딕은 현재 받아 들여지고 있지만 Playfair에서는 이탤릭체를 사용하고 있지만 실제로 작동하지는 않습니다. –

,이 올바른지 확인, 당신이 당신의 글꼴 파일에 대한 상대 경로를 사용하고 작은 따옴표

또한

.mainfooter h3{ 
    font-family: 'Goth'; 
} 

footer h1, 
footer h2, 
footer h3{ 
    font-family: 'Playdisplay'; 
}

에 글꼴 이름을 배치하십시오!

출처

2016-07-11 14:31:17 Lee

정말 다른 효과를 내지 않습니다. 질문에서 언급 한 것처럼. 첫 번째 글꼴 유형 (Playdisplay)이 작동합니다. 나는 그들 모두를 동일하게 적용했고 그것들은 같은 폴더에있다. –

첫 번째 글꼴의 글꼴 코드를 제거하거나 주석 처리하면 두 번째 .. 글꼴을 그대로두고 코드에 적용됩니까? – Lee

처음에는 모든 형식 (.ttf)을 제거 했으므로 형식에 문제가있는 것 같습니다. hoth h1, h2, h3는 더 이상 PlayfairDisplay를 허용하지 않습니다. –

CSS 글꼴 다람쥐가 제대로 적용되지 않음

답변

관련 문제