프로그래밍/HTML & CSS
[CSS 기본] 텍스트 관련 스타일 (2)
ITDevStory
2021. 11. 14. 18:57
[프로그래밍/HTML & CSS] - [CSS 기본] 텍스트 관련 스타일 (1)
color 글자 색 지정
text-decoration 텍스트에 줄 표시/제거
text-decoration: none | underline | overline | line-through
속성 값 | 설명 |
none | 밑줄 표시 X |
underline | 밑줄 표시 |
overline | 영역 위로 선 그리기 |
line-through | 취소선 그리기 |
text-transform 텍스트 대/소문자 변환
text-transform: none | capitalize | uppercase | lowercase | full-width
속성 값 | 설명 |
none | 변환 X |
capitalize | 첫 번 째 글자를 대문자로 변환 |
uppercase | 모든 글자를 대문자로 변환 |
lowercase | 모든 글자를 소문자로 변환 |
text-shadow 그림자 효과
text-shadow: none | <가로 거리> <세로 거리> <번짐 정도> <색상>
white-space 공백 처리
white-space: normal | nowrap | pre | pre-line | pre-wrap
속성 값 | 설명 |
normal | 여러 개의 공백을 하나로 표시 |
nowrap | 여러 개의 공백을 하나로 표시하고 영역 너비를 넘어가는 내용은 줄을 바꾸지 않고 한 줄로 표시 |
pre | 여러 개의 공백을 그대로 표시하고 영역 너비를 넘어가는 내용은 줄을 바꾸지 않고 한 줄로 표시 |
pre-line | 여러 개의 공백을 하나로 표시하고 영역 너비를 넘어가는 내용은 자동으로 줄을 바꿔 표시 |
pre-wrap | 여러 개의 공백을 그대로 표시하고 영역 너비를 넘어가는 내용은 자동으로 줄을 바꿔 표시 |
letter-spacing & word-spacing 텍스트 간격 조절
letter-spacing: normal | <크기>;
word-spacing: normal | <크기>;