@font-face 적용하기

ie8 이하 : eot
ie9: woff
나머지: ttf
맥: otf

eot converter:  http://eotfast.com/ 
http://ttf2eot.sebastiankippe.com/ 
woff 변환툴 :  http://people.mozilla.com/~jkew/woff/ 
http://orionevent.comxa.com/otf2woff.html 

css

@font-face{font-family:'이름정의'; 1

src:url('eotfile.eot'); 2
src:local('특수문자').url('url_wofff_file.woff') format("woff"),  3

url('url_wofff_file.ttf') format("truetype")
url('url_otf_file.otf') format("opentype") ;  4
} 

1. 원하는 이름을 정의
2. eot 파일이 위치한 곳과 URL 정의
3. 해당글꼴을 다운받지 못하도록
3,4 해당글꼴의 이름과 타입 지정

주의사항: 2종이상의 글꼴을 사용하지 말아야 함.


font-family: '원하는 이름 지정'
src: url('eot 파일이 있는 폴더 및 파일이름')
src:local(''),
url('woff 파일이 있는 폴더 및 파일이름') format('woff')
url('ttf 파일이 있는 폴더 및 파일이름') format('turetype')
url('otf 파일이 있는 폴더 및 파일이름') format('opentype')

ttf 파일 또는 otf 파일일 때는 하나만 써줍니다.
맥이나 윈도우, 둘다 ttf 파일과 otf 파일을 인식합니다.

http://www.fontsquirrel.com/fontface/generator 

요기가서 원하는 ttf를 올리면 svg부터 맥폰트까지 만들어주고 소스도 긁어올수가 있다

skuinc_symbol font가 전체적으로 폰트들이 아래로 처지는 현상

fico 폰트로 테스트 후 그것도 아래로 처지는지 확인 : 왜그럴까?? 

문제는 font 설정이 general 또는 symbolic 의 차이인듯.

 어느날 보니 최과장님이 해결하신듯 이유는 모르겠음.