오프라인에서 다운로드 한 글꼴 사용

Question

방금 ​​Google 글꼴을 다운로드했습니다. 페이지의 특정 섹션에서 사용하고 싶습니다. 나는 잘못된 방식으로 글꼴을 사용하고 있다고 생각합니다.

.page-header { 
    font-family: 'Calligraffitti', cursive; 
    src : url('../fonts/Calligraffitti/Calligraffitti-Regular.ttf'); 
} 

올바르지 않은 경우 시스템에 설치되지 않은 글꼴을 사용하는 올바른 방법을 알려주시겠습니까?

Answer 1

CSS 문서 맨 위에 추가하십시오.

@font-face { 
    font-family: Calli; 
    src: url('../fonts/Calligraffitti/Calligraffitti-Regular.ttf'); 
} 

당신은 다음과 같이 사용할 수 있습니다 :

.page-header { 
    font-family: Calli; 
}