문장 Text Properties
낱말간격
Word Spacing
형식 word-spacing:<value=normal
|<length>>
보기
P { word-spacing:
1px }
B { word-spacing: -2px }
낱말 사이의 간격을 정한다. 음수도 사용할 수 있다.
문자간격
Letter Spacing
형식 letter-spacing:<value=normal
|<length>>
보기
H1 { letter-spacing:
1px }
P { letter-spacing: -1px }
문자 사이의 간격을 정한다. 음수도 사용가능하다.
장식
Text Decoration
형식 text-decoration:<value=none
| underline | overline | line-through | blink>
보기 A { text-decoration:
none } 링크Link에 자동으로 설정되는
밑줄을 없앤다.
문자에 밑줄Underline, 윗줄Overline, 중간줄Line-Through,
깜빡이Blink 등을 지정할 때에 사용한다.
수직정렬
Vertical Alignment
형식
vertical-align:<value=baseline
| sub | super | top | text-top | middle | bottom | text-bottom | percentage>>
보기
IMG { vertical-align:
super }
A { vertical-align: 50% }
HTML의 EM이나, A, IMG처럼 줄바꿈Line Break하지
않는 요소Element(=Inline Element)에 적용되며, 줄간격Line-Height내에서의 상대적 위치를 지정한다.
음수도 사용가능하다.
baseline : 문자의 밑선에 맞추어 정렬.(초기값Initial
Value)
middle : 문자의 중앙을 밑선으로 해서 정렬.
sub : 아래첨자Subscript
super : 윗첨자Superscript
text-top : 문자의 윗선을 밑선으로 해서 정렬.
text-bottom : 문자의 밑선을 윗선으로 해서 정렬.
top : 상단에 정렬
bottom : 하단에 정렬
문자변환
Text Transformation
형식 text-transform:<value=none
| capitalize | uppercase | lowercase>
보기 H1 { text-transform:
uppercase }
영어의 대소문자를 변환한다.
capitalize : 각 낱말의 첫글자를 대문자로
바꾼다.
uppercase : 각 낱말의 모든 글자를 대문자로 바꾼다.
lowercase : 각 낱말의 모든 글자를 소문자로 바꾼다.
문장의
위치지정 Text Alignment
형식 text-align:<value=left
| right | center | justify>
보기 H1 { text-align:
center } H1안의
문장이 중앙에 가도록 한다.
묶음요소Block-Level Elements(P, H1
등)에만 적용된다. HTML의 ALIGN과 비슷한 기능을 한다.
들여쓰기
Text Indentation
형식 text-indent:<value=<length>
|<percentage>>
보기 P { text-indent:
5px }
묶음요소Block-Level Elements(P, H1등)에만
적용되며, 문단의 첫줄을 들여쓰기하는 정도를 지정한다.
줄간격
Line Height
형식 line-height:<value=
normal |<number> |<length>
|<percentage>>
문단에서 줄과 줄 사이의 공간을 지정한다.