728x90
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 탭을 클릭하셔서 선택하시면 됩니다.
반응형
'Language' 카테고리의 다른 글
[Kotlin] IntelliJ에서 Kotlin 시작하기 (0) | 2019.05.11 |
---|---|
[highlight.js] 티스토리 신규 에디터에 소스코드 입력 (0) | 2019.04.19 |
[React Native] 카메라 적용하기 (react-native-camera) (0) | 2017.05.17 |
[ReactJS] ReactJS + Nginx + Docker 구성하기 (0) | 2017.04.24 |
[ReactJS] React Router 사용하기 (0) | 2017.04.05 |