1. CSS 속성 값 [ 텍스트 꾸미기 ]
ㅇ 글자체 제어 : ☞ CSS 폰트 참조 (글꼴,크기,굵기,유형 등)
- (font,font-family,font-size,font-weight,font-style,font-variant)
ㅇ 텍스트 효과 : 아래 2.항 참조 (밑줄,윗줄,취소선,깜박임 등)
- (text-decoration : overline,line-through,underline,none 등)
ㅇ 텍스트 배치 : 아래 3.항 참조 (들여씀,수평정렬,글자간격,단어간격,글줄임 등)
- (letter-spacing,word-spacing,text-indent,text-align,text-overflow,direction)
ㅇ 텍스트 색상 ☞ CSS 색상 참조 (color)
ㅇ 텍스트 음영 ☞ CSS 그림자 참조 (text-shadow)
ㅇ 기타 속성 : 아래 4.항 참조
- 줄 간격 : (line-height)
- 대소문자 : (text-transform : uppercase,lowercase,capitalize)
- 글자 여백 : (white-space : normal,nowrap,pre,pre-wrap,pre-line)
2. CSS 텍스트 효과 (Text)
ㅇ text-decoration
- none (효과 없음)
- underline (밑줄), overline (윗줄), line-through (가운뎃줄,취소선)
- blink (깜박거림, 대부분의 웹브라우저에서는 이에 무 반응)
3. CSS 텍스트 배치 (Text)
ㅇ text-indent : 들여씀
ㅇ text-align : 좌우 정렬 ☞ CSS 정렬 참조
- left, right, center (좌, 우, 중앙)
- justify (각 줄에 좌우 끝까지 꽉 차게)
ㅇ letter-spacing : 글자 간격
ㅇ word-spacing : 단어 간격
ㅇ text-overflow : 글 줄임
- { width : 200px; white-space : nowrap; text-overflow : ellipsis; }
. 폭이 200px 넘는 경우에, ... 로써 글 맺음
4. CSS 텍스트 기타 속성
ㅇ line-height : 줄 간격
- 절대값 단위 : px, ...
- 상대값 단위 : 배수 (1.5 등)
ㅇ text-transform : 영문 대소문자
- (uppercase,lowercase,capitalize)
ㅇ white-space : 글자 여백 (공백,줄바꿈 처리)
- normal : 연속 공백을 단일 공백 처리, 줄바꿈 무시, 길면 줄바꿈 일어남
- nowrap : 연속 공백을 단일 공백 처리, 줄바꿈 무시, 길어도 줄바꿈 없이 보여줌
- pre : 연속 공백,줄바꿈 모두를 그대로 보여줌
- pre-wrap : 연속 공백,줄바꿈을 그대로 보여주나, 길면 줄바꿈 일어남
- pre-line : 연속 공백을 단일 공백 처리, 줄바꿈 유효, 길면 줄바꿈 일어남
1.
2.