font 연동하기

font 를 css 파일내에 연동해보자.

1. 오픈된 구글 연결 주소로 간단히 import 시켜서 연결할수가 있다.

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

보통 css 파일내에 상단에 위치시키는데 문제는 로딩도 만만치 않게 걸린다는 점이다. (비추)

2. 폰트 파일들을 /font/ 폴더에 위치시키고 이를 연동하는 방식

@font-face{  font-family:"Nanum Gothic";  src:url('/font/NanumGothic.eot');  src:url('/font/NanumGothic.eot?#iefix') format('embedded-opentype'),  url('/font/NanumGothic.woff') format('woff'),  url('/font/NanumGothic.ttf') format('truetype');  url('/font/NanumGothic.svg#NanumGothic') format('svg')  src:local(※), url('/font/NanumGothic.woff') format('woff'); } @font-face{  font-family:"JejuHallasan";  src:url('/font/JejuHallasan-Regular.ttf'); }

2번 방법은 1번보다 더 로딩이 빠르고 안정적이다. (추천)

실제 코드에서 <span style="font-family:'Nanum Gothic','JejuHallasan';">코드코드</span> 이렇게 이용할 수 있다.