CSS - font 설정

1. font-family :  글꼴을 설정  {font-family:굴림 | 돋움체, …}
2. font-size : 글꼴 크기를 설정 {font-size:절대크기 | 상대크기}
3. font-style :  글꼴 기움임을 설정 {font-style: normal | oblique | italic}
4. font-weight :  글꼴의 두께 설정 {font-weight:normal | bold | bolder | lighter}
5. letter-spacing : 글꼴 간격 설정 {font-spacing:절대크기 | 상대크기}
6. line-height :  줄의 높이 설정 {font-height:절대크기 | 상태크기}

7. font-size : 글자크기 {font-size:15px;}

8. font-style ( normal : 기본값 / oblique : 기울임 / italic : 이텔릭체 모양??)

9. font-weight ( bolder : 굵게 / bold : <b>태그와 같음 / lighter : 가늘게 [ normal은 400 / 가장가는거 100 / 가장굵은거 900 /

                      숫자는 보통 100 )

10. letter-spacing (  와 같음 / 글자끼리의 간격 설정 ) {letter-spacing:절대크기 | 상태크기}

11. line-height ( 줄글의 줄 높이를 조절 할 수 있다.) (style="line-height:150%")

12.  text-align : 텍스트 정렬 방식을 설정 { text-align:left | center | right | justify }
13. text-decoration :글꼴에 선 긋기 { text-decoration:none | underline |  overline | line-through | blink }

     ( underline 밑줄긋기 / overline 글자위에 긋기 / line-through 글자중간에긋기 /  blink 글자깜빡이게하기 )

14. text-indent : 들여쓰기 설정 { text-indent:절대크기 | 상대크기 }
15. text-transform :대문자 자동 변환 { text-transform:none | capitalize | uppercase | lowercase }
16. vertical-align : 글꼴을 수직으로 정렬하기 { vertical-align:top | middle | bottom}
17. text-align : 텍스트 정렬

18. text-indent : 들여쓰기 지정된 숫자만큼 들여써진다.

19. text-transform : 영문 대소문자 설정

     ( none  기본값 / capitalize  단어 첫 문자를 대문자로  / uppercase 모든 영문자를 대문자로 / lowercase  모든 영문자를 소문자로 )

20. vertical-align :  글자,이미지 수직으로 정렬

    ( top  위쪽과 셀의 위쪽을 기준으로 정렬 / middle 중간과 셀의 중간을 기준으로 정렬 / bottom  아래쪽과 셀의 아래쪽을 기준으로 정렬)

{font-family:굴림; font-size:9pt; color:black}
이것을 좀 더 간단하게 지정할 수 있습니다.
{font:9pt  "굴림"; color:black}

CSS의 font 약식표현에는 순서가 있습니다. font-style font-variant font-weight font-size font-family 이런 순서로 구성을 해주셔야만 제대로 보여집니다. ^

HTML 의 CSS에서 한글로 폰트명을 쓸 수도 있고, 영문으로 쓸 수도 있습니다.
한글명으로 기입해도 좋지만, 만에 하나 문제가 있다면 다음과 같이 영문명으로 대체하면 됩니다.


돋움 : Dotum
돋움체 : DotumChe

굴림 : Gulim
굴림체 : GulimChe

바탕 : Batang
바탕체 : BatangChe

궁서 : Gungsuh
궁서체 : GungsuhChe

새굴림: New Gulim

맑은 고딕 : Malgun Gothic



※ '맑은 고딕' 폰트는, 윈도우 비스타 이상의 OS에만 있음. '맑은고딕'이라고 붙여 쓰면 인식 못함.

※ 글꼴 이름에 공백이 있는 것, 즉 띄어쓰기가 된 폰트는 예를 들어 반드시
'Malgun Gothic'
이렇게 따옴표로 둘러싸 주어야 합니다. 그렇지 않으면 나중에 골치 아픈 에러가 날 수 있습니다.

※ 이름 끝에, '체'가 붙은 글꼴들은 '고정폭 폰트'입니다. 글자들의 간격이, 글자의 종류나 모양과 상관없이 항상 일정합니다. 프로그래밍을 할 때나, 가지런한 데이터를 작성할 때 '고정폭 폰트'를 주로 사용합니다. 따라서 일반적인 글쓰기에서는 '체'가 붙지 않은 글꼴을 사용하는 것이 자연스럽게 보입니다.

Segoe UI는 윈도우 비스타와 7에 기본적으로 내장된 폰트로서 기본 시스템 폰트입니다. 한글 한자 가나 그리스어 알파벳 등을 맑은 고딕, Meiryo, JhengHei 등의 클리어타입용 폰트로 보여줍니다.

출처 - http://prattler22.tistory.com/167