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에 폰트 명을 적어주면 된다.

웹 폰트 만들어주기

  1. 가지고 있는 폰트를 웹폰트로 만들어준다.
    • 각 브라우저에서 사용 가능한 웹 폰트 확장자가 다르다.
    • IE 6~9에서는 EOT 지원, 그 이후는 WOFF를 지원하는 등.
    • 그러니, 가지고 있는 폰트를 woff, eot 등으로 변환해준다.
  2. css로 font-family를 만든다.
    @font-face {
       font-family:Aspirin;
       src : url(location/좋은아스피린.eot) format('embedded-opentype');
       src : url(location/좋은아스피린.woff) format('woff');
    }
    
  3. 쓴다.
    body {
     font-family : Aspirin, serif;
    }
    

results matching ""

    No results matching ""