CSS FONTS 폰트 글꼴 설정

CSS에서의 폰트 글꼴 설정은 폰트의 굵기, 크기, 텍스트 스타일을 지정하게 됩니다.

font의 속성은 다음과 같습니다.

font-family - 글꼴의 모음을 지정할 때 사용합니다.

예> font-family:'dotum', san serif;

폰트패밀리 속성은 여러 글꼴을 넣는게 좋습니다. 브라우저에서 첫번째 글꼴을 읽지 못하거나 지원하지 않는다면 다음 순서의 글꼴을 지정하여 적용시킵니다. 글꼴이 없는경우에는 비슷한 글꼴로 나타냅니다. 영문의 단어가 두단어 이상일 경우에는 "따옴표"로 묶어줘야 합니다.

font-size - 글꼴의 크기 사이즈를 지정할때 사용합니다.

텍스트 크기의 지정은 굉장히 중요합니다. 포토샵디자인 시안에서의 사이즈와 html에서의 사이즈와 맞춰야 하며 절대 크기 또는 상대크기로 맞춰야 하기때문입니다.

예> font-size: 14px; 또는 0.7em

단위는 px단위와 em 단위 두가지로 표현합니다.

픽셀단위는 절대크기로 표현되며 em은 브라우저 사이즈에 맞춰 변경및 조정이 가능합니다.

font-weight - 글꼴의 두께는 지정합니다.

<B>태그나 <strong> 태그로 두께를 지정할 수 있지만 css만으로 글꼴의 두께를 설정하는게 편리합니다.

예> font-weight:normal; 또는 bold 로 지정합니다.

폰트에 따라서 100 ~ 800으로 지정하는 폰트도 있습니다.  

font-variant - 글꼴을 작은 대문자로 표시할지 지정합니다.

모두 대문자로 표기되지만 원래 대문자는 대문자 크기대로 나머지는 소문자 크기로 대문자로 표기가 됩니다.

예 > font-variant: normal; 또는 small-caps;

거의 사용하지 않는 기능이긴합니다.

font-style - 글꼴의 기울임을 지정하는데 사용합니다.

이 스타일에는 3가지가 있습니다.

예> font-style:normal, italic, oblique,

normal - 텍스트가 정상적으로 표시됩니다.

italic - 텍스트가 기울임으로 표시됩니다.

oblique - 텍스트가 기울어져 있습니다. (기울임꼴과 비슷하지만 약간 다릅니다.)