웹 폰트는 이전에 포스팅 한 woff(Web Open Font Format, http://www.hizine.net/61)를 이용한다. 아직 모든 브라우저에서 지원하지 않는다. 지원 목록은 다음과 같다.
- Firefox since version 3.6
- Google Chrome since version 6.0
- Internet Explorer 9
- Konqueror since KDE 4.4.1
- Opera since version 11.10 (Presto 2.7.81)
- Safari 5.1
- other WebKit-based browsers since WebKit build 528
확인했으면 아래 링크를 방문해서 맘에 드는 폰트를 선택한다.
http://www.google.com/webfonts
나는 예쁜 손 글씨체인 Bonbon 을 선택했다.
선택했으면 오른쪽 아래에 Quick-use를 클릭하면 내용에 다음과 같이 포함해야 할 css파일과 font-family 이름을 확인할 수 있다.
<link href='http://fonts.googleapis.com/css?family=Bonbon' rel='stylesheet' type='text/css'>
font-family: 'Bonbon', cursive;
예제에 나와있는 대로 아래와 css에 추가하거나 inline으로 style 속성에 추가해서 사용할 수 있다.
h1 { font-family: 'Metrophobic', Arial, serif; font-weight: 400; }