태터데스크 관리자

도움말
닫기
적용하기   첫페이지 만들기

태터데스크 메시지

저장하였습니다.

2008.08.06 14:20

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'
이렇게 따옴표로 둘러싸 주어야 합니다. 그렇지 않으면 나중에 골치 아픈 에러가 날 수 있습니다.

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

'웹표준 > CSS' 카테고리의 다른 글

clearfix  (0) 2010.01.19
[펌글] css로 수직 가운데정렬 4가지 방법  (0) 2009.12.31
css - font  (1) 2008.08.06
ie6에서 png 쓰기  (0) 2008.06.12
overflow  (0) 2008.05.20
파이어 폭스에서 hash 핵  (6) 2008.05.08
Posted by 고시랑

티스토리 툴바