● 텍스트를 보기 좋게 디자인할 때 사용한다.
● px : 절대단위(Absolute unit)이다.
● em : 상대단위(Relative unit)이다. 실제로 적용된 폰트 사이즈를 1em으로 정한다.
● rem : 상대단위(Relative unit)이다. html태그의 폰트 사이즈를 기준으로 1rem을 정한다.
▶ font-size
① 글씨의 크기를 설정할 때 사용한다.
② 단위는 px, em, rem이 있으며 주로 px을 사용한다.
▶ line-height
① 줄 간격을 설정할 때 사용한다.
② 단위는 px, em, rem이 있으며 주로 em을 사용한다. (폰트 사이즈를 기준으로 줄 간격을 정하는 게 이상적이기 때문)
③ em을 사용할 때는 관례로 em단위를 생략하여 입력한다.
④ 어떠한 값을 주더라도 항상 줄 간격의 가운데 배치된다.
▶ letter-spacing
① 자간을 설정할 때 사용한다.
② 단위는 px, em이 있으며 주로 em을 사용한다. (폰트 사이즈를 기준으로 글자 간격을 정하는 게 이상적이기 때문)
▶ font-family
① 서체를 설정할 때 사용한다.
▶ font-weight
① 글자의 굵기를 설정할 때 사용한다.
② 400, 700 값을 잘 기억해야 하는데, 400은 중간(Regular) 사이즈, 700은 굵은(Bold) 사이즈라고 생각하는 것이 관례이다.
③ 무조건 100단위여야한다. (120, 340 이런 거 안됨)
▶ color
① 글자의 색깔을 설정할 때 사용한다.
② 색을 표현하는 방법은 hex, rgb, rgba 3가지가 있다.
▶ text-align
① 텍스트를 정렬할 때 사용한다.
▶ text-indent
① 문단의 맨 앞부분을 들여쓰기, 내어쓰기 할 때 사용한다.
▶ text-transform
① 글자의 대소문자를 설정할 때 사용한다. 대소문자가 없는 언어(한국어, 중국어, 일본어 등)들에는 적용되지 않는다.
▶ text-decoration
① 글자의 밑줄을 설정할 때 사용한다.
② none, underline, line-through, overline이 있다.
③ none을 설정하여 a태그의 밑줄을 없애는 데에 주로 사용한다.
▶ font-style
① 글자의 기울기를 설정할 때 사용한다.
② normal, italic, oblique가 있다.
③ em태그는 기본적으로 기울기가 있는 상태인데, normal로 설정하여 기울기를 없애는 데에 주로 사용한다.
