티스토리 뷰

Language

Google Fonts

까레까레 2018.03.21 22:25

Google Fonts

웹을 개발할 때, 기본 폰트가 아닌 다른 폰트를 사용하는 경우가 많습니다. (한글은 특히 나눔폰트)

TTF 등의 폰트파일을 첨부해도 되는데, Google에서 제공하는 Fonts를 사용해보도록 하겠습니다.

https://fonts.google.com/

해당 사이트에 가보시면 다음과 같이 Fonts의 미리보기를 보실 수 있습니다.

문장, 문단, 숫자 등으로 미리보기를 할 수 있으며, 타입(Regular, Bold, Extra Bold 등)과 크기 또한 바꿀 수 있습니다.

폰트사용하기

각 폰트의 왼쪽 상단 를 클릭하시면 하단에 장바구니와 같이 폰트가 추가됩니다.


검은 영역을 클릭하시면 아래와 같이 커지면서 추가방식을 선택할 수 있습니다.


HTML 파일에 link 방식으로 추가하실 경우에는 STANDARD를 선택하고 해당 구문을 복사하시면 됩니다.


CSS 파일에 @IMPORT 방식으로 추가하실 경우에는 @IMPORT를 선택하고 해당 구문을 복사하시면 됩니다.


사용하실 때는 예시에 나온 것 처럼( font-family: 'Nanum Gothic', sans-serif; ) 사용하시면 됩니다.


만약 기본 폰트 이외에 다른 옵션을 사용하고자 하시는 경우에는 CUSTOMIZE 탭을 클릭하셔서 선택하시면 됩니다.

TAG
, , ,
댓글
댓글쓰기 폼