1. 구글 폰트 사이트에서 원하는 웹 폰트 찾기
링크텍스트에 접속해 Language목록에서 Korean을 선택하고
Korean이 지원되는 폰트중 원하는 폰트를 골라서 클릭한다.
2. 웹 폰트 스타일 복사하기
폰트 페이지 오른쪽 아래에 있는 Select this style을 클릭 후 나오는 웹 폰트에서 @import를 클릭한다. 그리고 아래의 css rules는 CSS에서 font-family를 적용할때 복사하여 사용한다.
ex)
font-family: 'Nanum Gothic', sans-serif;3. 웹 문서에 스타일 소스 넣고 결과 확인하기
@import 탭에서 link코드를 복사하여 HTML의 head 부분에 추가한다.
그리고 사용할 스타일에 위의 css rules에 적힌 코드를 복사한다.
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Google Fonts practice</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic&display=swap');
h1 {
font-family: 'Nanum Gothic', sans-serif;
}
</style>
<link rel="stylesheet" href="styles.css" />
</head>위의 코드내용은 Nanum+Gothic체를 구글폰트에서 가져오고 h1태그의 폰트를 'Nanum Gothic'으로 사용하는 것이다.
