Web Font
웹페이지에서 사용하기 위한 폰트를 의미하며, Truetype(ttf), Opentype(otf), Embedded-Opentype(eot), Open Web Font Format(woff)등의 확장자를 가짐.
사용하기(구글 웹 폰트)
@import url(http://fonts.googleapis.com/earlyaccess/hanna.css);
h1 {
font-family : 'Hanna', sans-serif;
}
웹폰트 url을 import해 주고, font-family에 폰트 명을 적어주면 된다.
웹 폰트 만들어주기
- 가지고 있는 폰트를 웹폰트로 만들어준다.
- 각 브라우저에서 사용 가능한 웹 폰트 확장자가 다르다.
- IE 6~9에서는 EOT 지원, 그 이후는 WOFF를 지원하는 등.
- 그러니, 가지고 있는 폰트를 woff, eot 등으로 변환해준다.
- css로 font-family를 만든다.
@font-face { font-family:Aspirin; src : url(location/좋은아스피린.eot) format('embedded-opentype'); src : url(location/좋은아스피린.woff) format('woff'); }
- 쓴다.
body { font-family : Aspirin, serif; }