글자의 스타일을 지정할때 사용하는 Font 속성입니다.
<div style="font-family:verdana;font-size:9pt;color:#FF0000;font-style:inherit;font-weight:bold;letter-spacing:-2px;word-spacing:3px;line-height:200%"> 글자의 스타일을<br> 지정할때 사용하는 Font 속성입니다. </div>
결과
1. font-family
글꼴을 설정합니다.
2. font-size
글꼴의 크기를 설정합니다.
* 절대(고정) 크기의 단위
표기 | 단위 | 표기 | 단위 |
in | 인치 (1인치 = 2.54cm ) | xx-large | medium보다 4.5배 확대 |
cm | 센티미터 | x-large | medium보다 3배 확대 |
mm | 밀리미터 | large | medium보다 1.5배 확대 |
pt | 포인트 ( 1포인트 = 1/72인치 ) | small | medium보다 1.5배 축소 |
pc | 파이카 ( 1파이카 = 12포인트 ) | x-small | medium보다 3배 축소 |
medium | 12pt 크기 | xx-small | medium보다 3.5배 축소 |
* 상태(비례) 크기의 단위
표기 | 단위 |
em | 기준 글꼴 문자의 높이 |
ex | 기준 글꼴 문자의 영문 소문자 높이 |
% | 기준 글꼴 크기에 대한 백분률 크기 |
px | 1픽셀을 1로 하는 단위 |
larger | 글자 크기를 앞에 입력한 글자보다 크게 |
smaller | 글자 크기를 앞에 입력한 글자보다 작게 |
3. font-style
글자의 기울기를 설정합니다.
normal - 정상
oblique - 글꼴이 기운 형태
italic - 글꼴이 이탤릭 형태, 이탤릭 글꼴이 없으면 oblique로 표시
inherit - 부모 요소의 값을 상속
4. font-weight
글자의 두께를 설정합니다.
normal - 정상
bolder - 조금 더 굵게
bold - 굵게, <b> 태그 효과와 동일
lighter - 가늘게
100 (가장 가늘게) ~ 400 (normal) ~ 900 (가장 굵게) 숫자를 이용해 지정할 수도 있습니다.
5. letter-spacing
글자 사이의 간격을 설정합니다. 기본은 0이며 숫자가 커질수록 간격이 넓어지고 작아질수록(음수) 좁아집니다.
6. word-spacing
단어 사이의 간격을 설정합니다. 기본은 0이며 숫자가 커질수록 간격이 넓어지고 작아질수록(음수) 좁아집니다.
7. line-height
줄 간격을 설정합니다. 퍼센트(%) 또는 픽셀(px), 포인트(pt) 등 절대/상태 크기의 단위로 지정 가능합니다.