NanumSquare 웹폰트 사용해보기

nanumsquare.css

/*
 * Nanum Square Web Fonts
 * Copyright (c) 2010, NAVER Corporation (http://www.nhncorp.com)
 */

@font-face {
  font-family: "NanumSquareLight";
  src: url(/font/NanumSquareL.eot);
  src: url(/font/NanumSquareL.eot?#iefix) format('embedded-opentype'),
  url(/font/NanumSquareL.woff) format('woff'),
  url(/font/NanumSquareL.ttf) format('truetype');
}

@font-face {
  font-family: "NanumSquare";
  src: url(/font/NanumSquareR.eot);
  src: url(/font/NanumSquareR.eot?#iefix) format('embedded-opentype'),
  url(/font/NanumSquareR.woff2) format('woff2'),
  url(/font/NanumSquareR.woff) format('woff'),
  url(/font/NanumSquareR.ttf) format('truetype');
}

@font-face {
  font-family: "NanumSquareBold";
  src: url(/font/NanumSquareB.eot);
  src: url(/font/NanumSquareB.eot?#iefix) format('embedded-opentype'),
  url(/font/NanumSquareB.woff2) format('woff2'),
  url(/font//NanumSquareB.woff) format('woff'),
  url(/font/NanumSquareB.ttf) format('truetype');
}

스타일시트 구현한다.

<style type="text/css">
    .caption4 {
        font-family: "NanumSquare";
        font-size: 19px;
        line-height: 28px;
        font-weight: 600;
    }
</style>

아니면... https://github.com/moonspam/NanumSquare 여기 사이트가면 쉽게 사용하는 방법도 제공합니다.

NanumSquare.zip

저작자표시비영리동일조건

'프로그래밍 > HTML' 카테고리의 다른 글

갤러리 퍼블리싱한 html 자료입니다. (0)	2018.12.07
NanumSquare 웹폰트 사용해보기 (0)	2018.04.20
폰트 사이즈 font sizes 에서 points, pixels, ems, percent 비교 (0)	2018.04.20
비동기 화면에서 뒤로가기 back 버튼 마우스를 클릭시 window.history.pushState 사용하기 (0)	2018.04.09
엑셀을 html 의 table 테이블 html 태그 제공 (https://codebeautify.org) (0)	2017.11.06
javascript 로 로딩바 만들어 보기 (0)	2017.07.07