프로그래밍/CSS

CSS 웹 폰트 적용하기

미냐님 2020. 4. 3. 21:40
728x90

CSS 웹 폰트 적용하기

  • 웹 폰트는 상업과 개인용으로 이용이 가능한 Noto Sans CJK KR(본고딕)을 예로 들겠습니다.
  • Google Fonts에 접속합니다.
  • 원하는 폰트를 선택후 Embed 탭에서 < link > 로 할지, @import 로 할지 선택합니다.
  • @import
    • CSS 파일 맨 상단에 아래와 같이 선언
    • 선택자에 폰트 적용: font-family: ‘Noto Sans KR’, sans-serif;
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100&display=swap');

body {
  font-family: 'Noto Sans KR', sans-serif;
}
  • < link >
< link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100&display=swap" rel="stylesheet" >
728x90