최근의 모든 브라우저들은 웹 서체(Web Font)라는 것을 지원하며 사이트를 볼 때 다운되는 서체를 웹 폰트라고 한다.
웹 폰트 또한 font-family 속성을 사용하지만, @font-face 지시어(directive)라는 CSS 명령어를 사용해서 웹 브라우저에게 해당 서체를 다운로드할 것을 알리면서 사용할 수 있다.
@font-face {
font-family: 'Apple SD Gothic Neo';
font-style: normal;
font-weight: 800;
src: url(../font/AppleSDGothicNeoEB.woff2) format("woff2");
}
'Apple SD Gothic Neo: font 속성에서 폰트명(font face)으로 지정될 이름을 설정한다.
normal: 폰트 모양을 정하는 속성으로 기본, 이탤릭체 등이 있다.
800: 폰트의 굵기를 정한다.
src: 폰트 파일의 위치를 나타내는 URL 값 또는, 사용자 컴퓨터에 설치된 폰트명을 local("Font Name")형식으로 지정하는 속성