[HTML CSS] 폰트 바꾸기

1. vsc에서 작업할 폴더를 연 후 assets 폴더를 만들고, assets 하위 폴더로 fonts 폴더를 만든다
2. TTF 파일을 ./assets/fonts 폰트 폴더에 넣는다.
3. css 파일에 폰트 페이스 에 이름, 경로를 넣는다.

@font-face {
font-family: "DS-DIGI";
src: url("./assets/fonts/DS-DIGI.TFF");
}

• 친절하게 코드 형태를 주는 폰트 웹사이트도 있고, 그렇지 않은 경우도 있다.
• 코드가 있는 경우 위와 같은 형태일 것이다. 복사해서 css 파일 맨 위에 넣어놓으면 된다.
• font-family 에 폰트 이름을 원하는 대로 넣으면 되고 (앞으로 css 파일에서 이 폰트를 부를 이름이 된다.)
• src에 경로를 넣어주면 된다.

4. 클래스를 태그에 넣어 원하는 곳에 폰트를 사용할 수 있도록 전용 클래스를 만들어준다.

.font-digi {
font-family: "DS-DIGI";
}

5. html 파일로 넘어가서 폰트를 사용하고 싶은 곳의 태그에 클래스를 넣어준다.

<div class="font-digi" >폰트를 여기에 적용하고 싶은가? 클래스를 넣어라!</div>