Program Tip

웹 사이트에서 사용자 정의 글꼴을 사용하려면 어떻게합니까?

programtip 2020. 11. 1. 18:33
반응형

웹 사이트에서 사용자 정의 글꼴을 사용하려면 어떻게합니까?


이 질문에 이미 답변이 있습니다.

내 웹 사이트가보기 좋게 보이려면 사용자 지정 글꼴, 특히 Thonburi-Bold를 사용해야합니다. 문제는 사용자가 설치하지 않으면 글꼴이 표시되지 않는다는 것입니다. 파이어 폭스에서도 표시되지 않습니다.

이 문제에 대한 해결 방법이 있습니까?


다음과 같이 스타일 시트에서 글꼴을 가져와야합니다.

@font-face{
    font-family: "Thonburi-Bold";
    src: url('Thonburi-Bold.ttf'),
    url('Thonburi-Bold.eot'); /* IE */
}

CSS3 font-face또는 웹 폰트를 사용할 수 있습니다.

@ font-face 사용

@font-face {
   font-family: Delicious; 
   src: url('Delicious-Roman.otf');
} 

웹 폰트

Google Webfonts, http://www.google.com/webfonts 살펴보기


예, 방법이 있습니다. CSS에서 사용자 지정 글꼴이라고합니다. CSS를 수정하고 해당 글꼴을 웹 사이트에 업로드해야합니다.

이를 위해 필요한 CSS는 다음과 같습니다.

@font-face {
     font-family: Thonburi-Bold;
     src: url('pathway/Thonburi-Bold.otf'); 
}

CSS를 사용하면 웹 사이트에서 사용자 지정 글꼴, 다운로드 가능한 글꼴을 사용할 수 있습니다. 예를 들어 원하는 글꼴을 다운로드 myfont.ttf하여 블로그 또는 웹 사이트가 호스팅되는 원격 서버에 업로드 할 수 있습니다.

@font-face {
    font-family: myfont;
    src: url('myfont.ttf');
}

먼저, 서버의 어딘가에 글꼴을 .otf 또는 .ttf로 넣어야합니다.

그런 다음 CSS를 사용하여 다음과 같이 새 글꼴 모음을 선언합니다.

@font-face {
    font-family: MyFont;
    src: url('pathway/myfont.otf'); 
    }

글꼴 패밀리를 선언 한 CSS 파일에 문서를 링크하면 다른 글꼴과 마찬가지로 해당 글꼴을 사용할 수 있습니다.

참고 URL : https://stackoverflow.com/questions/13585186/how-can-i-use-custom-fonts-on-a-website

반응형