React 로 사이트를 만들다 보면, 영어는 그럭저럭 기본적으로 사용할 만한 font 가 많은 것에 비해서
한글은 썩 예쁜 글자 찾기가 어렵습니다.
그래서 이번에는 괜찮은 한글 폰트 파일을 찾고 이를 적용하겠습니다.
@font-face {
font-family: 'Adultkid';
src: url('../Font/Adultkid.ttf') format('truetype');
}
위처럼 font-face 를 사용 가능합니다.
특정한 경로에 tff 파일을 넣어두고 그 위치를 url 로 지정을 하여 사용이 가능합니다.
저는 제가 해당 폰트를 사용하기 위한 CSS 파일의 가장 윗줄에 위와 같이 @font-face 를 지정했습니다.
이제 해당 CSS 파일 내부에서는 저 폰트를 사용 가능한 거죠.
.rad-text{
margin-left: 0.3rem;
font-family: 'Adultkid'; /* 둥근 글자체 선택 */
}
이런 식으로 내가 지정한 font-family 의 이름으로 사용이 가능합니다.
@font-face {
font-family: 'Keroro';
src: url('../Font/Adultkid.ttf') format('truetype');
}
.rad-text{
margin-left: 0.3rem;
font-family: 'keroro'; /* 둥근 글자체 선택 */
}
만약 내가 CSS 파일 상단에서 다음과 같이 keroro 라는 이름으로 글씨체를 정했으면
아래쪽에서도 font-family 는 keroro 로 사용을 해야 합니다.
위가 적용하기 전의 필드입니다.
귀엽게 바뀌었습니다. ㅎㅎ