web font

기본형
@font-face {
font-family: 글꼴 이름;
src: url(글꼴파일경로) format(파일유형);
}

  <style>
 
  @font-face {
    font-family: 'trana';
    src: local('trana'), /* 내 pc안에서 찾기 */
        url('trana.eot'), /* 인터넷 익스플로러6이하, 서비스중지 */
        url('trana.woff') format('woff'), /* modern web */
        url('trana.ttf') format('truetype'); /* woff형식 지원하는 브라우저는 woff파일 다운로드 */
   }

   w-font {
    font-family: 'trana', sans-serif;
   }
    
  </style>

• ttf 폰트를 eot파일과 woff파일로 변환
• ttf 파일은 다른 형식의 파일보다 용량이 크기 때문에 대부분읭 모던 브라우저에서 지원하는 woff글꼴 파일을 먼저 선언하고 ttf파일을 나중에 선언한다. 이렇게 하면 woff형식을 지원하는 브라우저는 woff파일을 다운로드하고 그 후 선언된 ttf파일은 다운로드 하지 않는다.
  eot파일은 포맷을 따로 지정하지 않음.