CSS 텍스트 스타일링 및 구글 폰트 사용하여 적용하는 방법 알아보기

텍스트 폰트 지정 font-family 속성 HTML 웹페이지에서 사용하는 기본 글꼴 외에 다른 글꼴을 사용해서 표현하고 싶다면 CSS의 font-family 속성을 사용하면 됩니다. font-family 속성 안에 지정한 글꼴은 클라이언트 즉 웹페이지를 사용하는 사 용자의 PC에 해당 글꼴이 설치되어 있어야지만, 정상적으로 지정한 글꼴이 나타나게 되며 그렇지 않은 경우에는 기본 글꼴로 표현 이 됩니다. 이런 경우를 방지하기 위해 font-family 속성 안에 여러 개의 글꼴을 순서대로 작성하여, 첫 번째 지정한 글꼴이 없을 경우 두 번째 지정한 글꼴이 표현 될 수 있도록 해야 합니다. font-family 속성을 body 태그에 적용할 경우 문서 전체의 폰트에 적용 됩니다. body { font-family : " 견고딕 " , " 견명조 " , " 돋움 " ; } ※ 위와 같이 지정할 경우 견고딕 폰트가 없을 경우 견명조로 표현되게 되고 견명조 폰트가 없다면 돋움 폰트가 지정됩니다. 구글폰트 사용하여 웹폰트 적용하는 방법 앞서 살펴본 폰트 지정 방법은 사용자의 시스템에 해당 폰트가 있는 경우에만 정상적으로 폰트가 표현되는데, 폰트가 없는 경우 기본 글꼴로 표현이 됩니다. 이런 경우를 방지하기 위해, 웹상의 폰트를 지정하여 인터넷만 연결이 되어 있다면 아무 문제 없이 폰트가 적용되도록 할 수 있습니다. 1. 구글 폰트 사이트에서 사용할 폰트 검색 fonts.google.com에 접속하면 구글에서 제공하는 여러 폰트를 검색할 수 있습니다. 한글 지원 폰트를 찾을 경우에는 검색 필터 Language에서 Korean을 선택 하면 됩니다. 구글 폰트에 접속 후 Language에서 언어를 선택해서 해당 언어 지원 폰트를 필터링할 수 있다. 2. import 문과 font-family 속성 삽입 사용할 폰트를 찾았다면 폰트를 클릭 후 하단 리스트에서 사용할 폰트 굵기에서 우측의 S...