본문 바로가기

프로그래밍/CSS

CSS 폰트 임포트해서 각각 적용하기

<!doctype html>

<html lang="ko">

  <head>

    <meta charset="utf-8">

    <title>CSS | Google Fonts</title>

    <style>

      @import url(http://fonts.googleapis.com/earlyaccess/hanna.css);

      @import url(http://fonts.googleapis.com/earlyaccess/nanumbrushscript.css);

      @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

      @import url(http://fonts.googleapis.com/earlyaccess/nanumgothiccoding.css);

      @import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

      @import url(http://fonts.googleapis.com/earlyaccess/nanumpenscript.css);

      .hn {font-family: 'Hanna';}

      .nbs {font-family: 'Nanum Brush Script';}

      .ng {font-family: 'Nanum Gothic';}

      .ngc {font-family: 'Nanum Gothic Coding';}

      .nm {font-family: 'Nanum Myeongjo';}

      .nps {font-family: 'Nanum Pen Script';}

    </style>

  </head>

  <body>

    <h1 class="hn">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h1>

    <h1 class="nbs">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h1>

    <h1 class="ng">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h1>

    <h1 class="ngc">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h1>

    <h1 class="nm">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h1>

    <h1 class="nps">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h1>

  </body>

</html>