웹사이트 구글 폰트 적용법을
알아보겠습니다.
구글 폰트 사이트 이동
구글에서 google fonts 또는 구글 폰트를 검색하여, 해당 사이트로 이동합니다.
<link> 태그 방식
원하는 폰트 선택
- 여기서 사용할 폰트와 폰트 사이즈를 선택합니다.
- Noto Sans KR 폰트를 적용하여, 해당 페이지로 이동한 후 원하는 사이즈 Regular 400과 Bold 700을 선택하면, 오른쪽 바에 해당 정보가 나옵니다.
- 아래 메뉴에서 <link> 태그 부분와 font-family 복사합니다.
사이트에 구글 폰트 적용
- 웹에디터에서 복사한 <link> 태그 코드를 <head> 태그 사이에 붙여넣기 합니다.
- style sheet 또는 <style>태그 사이에 복사한 font-family 코드를 붙여 넣기 합니다.
아래와 같이 로컬 서버를 띄워서 개발자 도구를 통하여
적용이 잘 된 것을 확인할 수 있습니다.
import 방식
웹에디터에서 css 파일에 복사한 코드를 붙여넣기 합니다.
반응형
'💻CODING > html, css' 카테고리의 다른 글
| [css] position으로 가운데 배치, 정렬 (0) | 2021.05.31 |
|---|---|
| [css] 구글 메터리얼 아이콘 사용 방법(ft. 무료 아이콘 제공 사이트) (0) | 2021.05.30 |
| [css] reset css cdn 설치(ft. 기본 css style 세팅) (0) | 2021.05.26 |
| [css] block, inline의 뜻과 사용법(ft. display, inline-block) (0) | 2021.05.24 |
| thailwind css 스타일 프레임워크 (ft. 무료 컴포넌트 사이트 제공) (0) | 2021.04.29 |
댓글