웹폰트는 전에 한번 소개한적이 있다.

그래도 간단하게 좀더 설명을 드리고 가면

우리가 웹페이지를 만들며 기본폰트 말고 자신에 컴에 있는 다양한 폰트를 사용하고픈 생각이 들게 된다.

이때 웹폰트를 사용하게 된다.

자신에 컴에 있는 폰트는 ttf 형식으로 익스에선 인식을 못한다.

익스에선 eot형식에 폰트파일만 인식한다.

근데 익스를 제외한 다른 브라우져에선 eto는 인식을 못한다 그래서

하나의 폰트를 사용하기 우해서는 ttf  형식과 eot형식 두개를 만들어 올려야

모든 브라우져에서 폰트를 적용한 모습이 나타나게 된다.

첨부한 파일은 eotfast 란 프로그램으로 ttf 파일을 손쉽게 eot 파일로 변환해준다.

사용법은 http://eara.tistory.com/150

변환한 두개의 파일을 업로드 한뒤

<style type="text/css">

<!--

@font-face {font-family:han; src:url(http://gsm.dothome.co.kr/font//han.woff);} 

@font-face {font-family:han; src:url(http://gsm.dothome.co.kr/font//han.eot);} 

-->

</style>

<span style="font-family:han;font-size:15px;font-weight:lighter;line-height:36px;color: rgb(255, 0, 0);">

가나다

</span>

이런식으로 적용하면 된다.

han은 걍 폰트 이름으로 임의적인 것이다.

url은 업로드된 폰트의 주소

근데 han이란 이름으로 두개인 이유는 브라우져에 따라 허용되는 것을 출력하라고 두개

아래 span에선 size 폰트 크기 line-height는 줄간격이라 생각하면 됨

첨부한 파일이 두개인데 하나는 woff만드는 프로그램이고 다른 하나는 위에서 말한데로 eot만드는 프로그램이다.

사용법은 둘다 같다.

적용된 모습 이렇게 식으로 폰트가 적용된다. 그리고 이렇게 사용한 다음은 브라우져별로 확인해 볼 필요가 있다.

참고로 폰트파일에 용량이 꽤 된다 . 지금 확인해 보니 10메가 이상되는 것도 있다. 트래픽이 부족하신분들은 사용자제요

익스하고 크롬에서만 적용되넹