1. google font 접속

https://fonts.google.com/

 

Google Fonts

Making the web more beautiful, fast, and open through great typography

fonts.google.com

2. 마음에 드는 font 선택

3. 리스트에서 원하는 서체 선택 (모든 형식의 서체를 가져올 수 있지만, 로딩시 느려질 수 있으므로 필요한 폰트만 선택)

4. 오른쪽 폴딩창이 열리면서 현재 내가 선택한 서체의 목록과 Review / Embed 탭이 보임

5. Embed 탭을 선택

6. 우리는 css에서 import 할 예정이므로 @import 선택 (html에서 쓰려면 <link>  를 선택하자)

7. css 파일에 붙여넣기 (아래와 같은 형태로)

@import url("https://fonts.googleapis.com/css2?family= ");

8. 태그 안에 해당 코드를 입력함으로서 font 사용가능

body {
	...
	font-family: "Your Font Name" -a /* -a 의미는 시스템에서 제공하는 폰트를 순서대로 나열해준다 (만약 font가 없으면 순서대로 다음 폰트를 참조하겠다는 의미) */;
    
}

'웹 개발' 카테고리의 다른 글

npm install 에러  (0) 2020.09.09

+ Recent posts