홈페이지 나눔폰트 사용시 CSS 구글웹폰트 추가하기

홈페이지 나눔폰트 사용시 CSS 구글웹폰트 추가하기

사용자 컴퓨터에 나눔 폰트가 없는 경우

작업한 결과가 사용자에게 다른게 보이게 됩니다.

그래서 웹폰트를 적용하시면 똑같이 보이게 됩니다.

웹 페이지 상단에 나눔 폰트 적용합니다.

body {

font-family: 'Nanum Gothic','Nanum Brush Script','Nanum Gothic Coding','Nanum Myeongjo','Nanum Pen Script';

}

1. 외부 파일 불러오기

<link href='http://fonts.googleapis.com/earlyaccess/nanumbrushscript.css' rel='stylesheet' type='text/css'>

<link href='http://fonts.googleapis.com/earlyaccess/nanumgothic.css' rel='stylesheet' type='text/css'>

<link href='http://fonts.googleapis.com/earlyaccess/nanumgothiccoding.css' rel='stylesheet' type='text/css'>

<link href='http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css' rel='stylesheet' type='text/css'>

<link href='http://fonts.googleapis.com/earlyaccess/nanumpenscript.css' rel='stylesheet' type='text/css'>

2. CSS 파일 속에 import 추가하기

@import url(http://fonts.googleapis.com/earlyaccess/nanumbrushscript.css); 

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); 

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothiccoding.css); 

@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

@import url(http://fonts.googleapis.com/earlyaccess/nanumpenscript.css);

1.2. 번중에 하나를 사용하시면 됩니다.

CSS 파일 속에 넣는 것이 간단합니다.

기본으로 항상 불러 오는 CSS 파일 속에 넣어서 사용하시면 됩니다.

출처: https://www.google.com/fonts/earlyaccess