CSS 한글 폰트 선택하기 - 노토산스, NotoSansKR

CSS 한글 폰트 선택하기 - 노토산스, NotoSansKR

웹화면에 한글을 위해 폰트선택은 필수!

• 아래 글을 참고하세요.
• [CSS]웹 폰트 적용하는 방법, 나눔고딕 웹에 적용

[CSS]웹 폰트 적용하는 방법, 나눔고딕 웹에 적용

• 한글은 노토산스, 영문/숫자는 다른 폰트로 해주세요...👀 (feat. unicode)

한글은 노토산스, 영문/숫자는 다른 폰트로 해주세요...👀 (feat. unicode)

실제 적용 CSS

<link href="//fonts.googleapis.com/earlyaccess/hanna.css" rel="stylesheet" type="text/css">
<link href="//fonts.googleapis.com/earlyaccess/nanumgothic.css" rel="stylesheet" type="text/css">
<style type="text/css">

@font-face {
  font-family: "NotoSansKR";
  src: url("/fonts/NotoSans-Regular.woff") format("woff");
  font-style: normal;
}
@font-face {
  font-family: "NotoSansKR";
  src: url("/fonts/OpenSans-Regular.woff") format("woff");
  unicode-range: U+0020-007E;
  font-style: normal;
}

body {
    font-family: "NotoSansKR","Novacento Sans Wide", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  //background: lightcyan;
  //font-size: 30px;
}

h1 {
    //font-family: 'Nanum Barun Gothic';
    font-family: "hanna","NotoSansKR","Novacento Sans Wide", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
    text-transform: none;
    //font-weight: bold;
}
h2, h3, h4, h5, h6 {
    font-family: "NotoSansKR","Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
    text-rendering: optimizeLegibility;
    color: #5e5e5e;
    font-weight: 400;
    letter-spacing: -1px;
}
</style>

바꾼 사이트의 폰트는 짜잔.