[HTML 태그] HTML 폰트 스타일 태그

HTML 태그는 인터넷상에서 사용하는 언어이고, 이 언어를 해석해서 화면으로 보여주는 것이 웹 브라우저 입니다. HTML 태그를 이용해서 글자를 쓰고 그림을 그리고 동영상을 만드는 등 모든 표현을 할 수 있지만 그 중에서도 가장 많이 쓰고 중요한건 '글자'겠죠. 

그리고 우리는 웹 페이지에서 HTML 폰트의 사이즈, 모양, 두께, 영문, 텍스트 사이 간격, 등 여러 속성을 설정할 수 있습니다. 오늘은 기초적이지만 가장 자주 쓰이는 텍스트 속성에 대해서 알아보도록 하겠습니다.

HTML 폰트 스타일 태그

<font-family> : 어떤 폰트를 사용할지 설정합니다.

<font-size> : 글씨의 크기를 지정합니다.

<font-style> : 글씨의 모양을 지정합니다.

<font-weight> : 글씨의 두께를 지정합니다.

일반적으로 HTML 폰트는 <sans-serif>와 <serif>로 나누어집니다. <sans-serif>는 끝 부분에 획이 없고 굵기가 일정한 글꼴입니다.

<serif>는 끝 부분에 획이 있는 명조 계열의 글꼴입니다. 간단히 설명하자면 <sans-serif>는 고딕체, <serif>는 명조체라고 생각하시면 됩니다.

CSS 탭에서 폰트 속성을 지정할때는 아래와 같이 지정하게 됩니다.

font-family:"나눔고딕", sans-serif;

위 뜻은, 해당 페이지에서 기본적인 글씨체는 나눔고딕을 사용하며 만약 시스템에 나눔고딕이 없으면 sans-serif 폰트를 사용하라는 의미입니다.

윈도우와 맥 등 사용하는 운영체계마다 사용하는 시스템 폰트가 다르므로 글씨체를 하나로 지정하면 웹 페이지마다 글씨체가 다르게 보일 수 있습니다. 그래서 기본적으로 위 폰트처럼 2개 이상의 폰트를 지정하여 차이를 줄이는 방법을 선택해야 합니다. 

이해가 되셨나요?? 웹폰트를 사용하면 위 방법이 해결이 되긴 합니다만, 오늘은 여기까지 하고 다음번에는 웹 폰트에 대해서 알아보도록 하겠습니다. ^ ^