css 폰트 쉽게 적용하기 (구글 폰트)

폰트 적용하기

  • 폰트를 적용하기 위해서 구글에 들어가서 원하는 폰트를 찾는다.
  • google fonts
  • 나는 나눔 고딕 코딩 을 선택했다.
  • 굵기를 선택하면 아주 친절하게 js 와 css 파일 설정값을 준다. 이를 적용하면 된다.
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Nanum+Gothic&family=Nanum+Gothic+Coding&display=swap" rel="stylesheet">
* { 
    font-family: 'Nanum Gothic', sans-serif;
    font-family: 'Nanum Gothic Coding', monospace;
}

  • 참고로 * 은 모든 것에 적용하는 것을 의미하며 원하는 블럭이나 태그가 존재하면 css 문법에 따라 적용한다.