정렬, 줄 간격, 장식과 글자 변환을 조절합니다.
text-align은 인라인 내용 정렬, line-height는 줄 사이 높이, text-decoration은 밑줄, text-transform은 대소문자 표현을 바꿉니다. 긴 본문은 적절한 줄 길이와 줄 간격이 중요합니다.
이번 예제의 출발점은 text-align: left; line-height: 1.7;입니다. 선택자가 고른 요소와 실제로 계산된 값을 개발자 도구에서 나란히 보면 선언이 적용되지 않은 이유를 빠르게 찾을 수 있습니다.
처음에는 예제를 그대로 확인한 다음 line-height를 1.2와 2로 비교하세요. 한 번에 한 값만 바꾸고 좁은 화면, 키보드 포커스와 200% 확대에서도 내용이 사라지지 않는지 확인하세요.
긴 한국어 본문을 가운데 정렬하면 다음 줄의 시작점을 찾기 어렵습니다.
직접 바꿔보세요line-height를 1.2와 2로 비교하세요.