@font-face

🤔 @font-face?

font face란 사용자가 갖고 있지 않은 폰트도 특정 경로로 연결시켜 다운 받아 사용받을 수 있게 정의

@font-face {
    font-family: "AnyTestFont";
    src: local("AnyTestFont"), url("AnyTestFont_경로.eot?#iefix") 
    	  format("embedded-opentype"),
          url('AnyTestFont.woff') format('woff'),
          url('AnyTestFont.otf') format('opentype'),
          url('AnyTestFont.svg') format('svg');
    font-weight: 500;
    font-style: normal;
}

• src 경로 순서

1. local (사용자 환경에서 찾기)
2. eot 
3. woff2/woff
4. ttf
5. svg

• Font format과 font-face 선언 및 적용법 : https://kimdabin.tistory.com/entry/Font-format%EA%B3%BC-font-face-%EC%84%A0%EC%96%B8-%EB%B0%8F-%EC%A0%81%EC%9A%A9%EB%B2%95
• Web Font - @font-face 적용 방법 : https://webclub.tistory.com/261