텍스트 정렬 스타일 속성(text-align, text-height)

텍스트 정렬(text-align)

속성값 (지정하지 않으면 왼쪽 정렬이 default)

• start : 현재 텍스트 줄의 시작 위치에 맞추어 문단 정렬
• end : 현재 텍스트 줄의 끝 위치에 맞추어 문단 정렬
• left : 왼쪽에 맞추어 문단 정렬
• right : 오른쪽에 맞추어 문단 정렬
• center : 가운데에 맞추어 문단 정렬
• justify : 양쪽에 맞추어 문단 정렬
• match-parent : 부모 요소를 따라 문단 정렬

.container {
	text-align: center;
}

줄 간격 조절 (line-height)

속성값

• 0px; : 줄 간격을 픽셀로 지정
• 2.0; : 해당 폰트의 배율. 이 경우 2.0배
• 200% : 해당 폰트의 배율. 이 경우 200%이므로 2.0배

보통 줄 간격은 글자 크기의 1.5배 ~ 2배가 가독성이 좋다.

p {
    font-size: 12px; line-height: 24px;
    font-size: 12px; line-height: 2.0;
    font-size: 12px; line-height: 200%;
}

/* 위의 세 속성 모두 줄 간격이 24px로 동일하다. */

 

출처 : 웹 표준의 정석 (고경희 저)