글꼴 Font Properties

글꼴종류
Font Family

형식 font-family:<family-name>
|<generic-family>>
보기 P
{ font-family: 굴림, “Comic Sans MS”, serif }

<family-name>에는 보기에서 한 것처럼
'굴림' 글꼴Font을 지정할 수 있으며, 사용 가능한 것이라면 어떤 글꼴Font도 가능하다. 다만, 만든 이Auther에게는
가능한 글꼴Font이지만, 사용자의 환경User Agent에는 없을 수도 있으므로,<generic-family>를
보기에서처럼 지정할 필요가 있다. ','를 이용하여 예비글꼴Generic
Font을 얼마든지 지정할 수 있다.
주의

보기의 “Comic Sans MS“처럼 띄어쓰기가 있는
글꼴이름Font name은 반드시 큰 따옴표나 작은 따옴표로 묶어 주어야 한다. 그렇지 않으면, 해당 글꼴Font을 읽어들이지
못한다.

글꼴체
Font Style

형식 font-style:<value=normal
| italic | oblique>
보기 P
{ font-style: italic }
이것은 문자Letter를 뉘여쓸 때 사용한다. normal은
초기값Initial Value으로 별도의 지정이 없는 상태와 동일하다. italic 또는 oblique는 문자Letter를 뉘여
쓰게 된다.

글꼴변형
Font Variant

형식 font-variant:
<value=normal
| small-cap>
보기 P
{ font-variant: small-cap }
font-variant는 문자Letter를 small-caps로
만들 때 사용하는데, 문장의 모든 문자를 소문자보다 약간 큰 대문자로 나타내는 기능을 한다.

글꼴굵기
Font Weight

형식 font-weight:<value=normal |
bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800
| 900>
보기 P
{ font-weight: small-cap }
bolder와 lighter는 상대값Relative Value로
기존에 설정된 글꼴Font을 기준으로 그 굵기가 정해진다. 이에 반해 나머지들은 절대값Absolute Value으로 그 굵기를
나타낸다. 그런데, 여기서 주의할 것은 100~900까지의 굵기 정도는 사용되고 있는 글꼴Font의 속성에 의존한다는 것이다.
즉, 기존 글꼴Font이 9단계의 굵기를 가지고 있지 않으면, 지정한 굵기와는 다르게 표현될 수 있다는 것이다.

글꼴크기
Font Size

형식 font-size:<absolute-size=xx-small
| x-small | small | medium | large | x-large | xx- large> | <relative-size=larger
| smaller> |< length='px'> |
<percentage='%'>
보기
P
{ font-size: large }
H1 { font-size: 12px }
LI { font-size: 90% }
B { font-size: larger }
font-size 특성은 출력되는 글꼴의 크기를 변경하는데
사용된다. 는 문자Letter를 조건없이 키우거나 줄이는데에 사용하고, 와
는 기존에 설정된 골꼴Font을 기준으로 해서 크기를 조정할 때에 사용한다. 그리고, lenght는
그 단위를 다양하게 지원하고 있다.

글꼴
Font

형식
font
:<font-style> |<font-variant>
|<font-weight> |<font-size> |
<line-height> |<font-family>

보기
P
{ font: italic nomal bold 13pt/15pt 굴림, impact }
글꼴Font는 모든 속성을 종합적으로 한꺼번에 사용할
때에 사용한다. 위 보기는 글꼴체Font Style는 'italic'으로, 글꼴변형Font Variant은 'nomal'로,
글꼴굵기Font Weight는 'bold로, 글꼴크기Font Size는 '13pt'로 줄간격Line Height는 '15pt'로,
글꼴종류Font Family는 '굴림' 또는 'impact'로 정하고 있다.

• 제작: w3master@sanyaro.com bestsouth@korea.com