4-4. 서체(font)와 글(text) 스타일 - 6

1. 글의 정렬 방법

"text-align" 속성은 블록 요소에 지정하면 그 내부에 포함된 글이나 인라인 요소들이 영향을 받습니다.

left	왼쪽 정렬
center	가운데 정렬
right	오른쪽 정렬
justify	양쪽 정렬

2. 글의 간격 조절하기

글자와 글자 사이의 간격은 "letter-spacing"속성을 사용하고, 단어 간의 간격은 "word-spacing"을 사용합니다. 줄 간격은 "line-height" 속성으로 지정합니다.

※ 주의할 점은 본문에 한글과 영문, 숫자 등이 섞여 있는 경우 각 종류 별 간격이 달라 보일 수 있는 점입니다. 한글 자간은 어울려 보이는데 영문은 좁아 보이거나, 숫자는 거의 붙어버리는 경우가 있을 수 있습니다.

2-1. 자간 조절(letter-spacing)

<style type="text/css"> .area p{letter-spacing: 0.1em;} </style>

2-2. 단어 간의 간격(word-spacing)

<style type="text/css"> .area p{word-spacing: 0.5em;} </style>

2-3. 줄 간격 조절(line-height)은 텍스트의 줄 간격뿐 아니라 블록 요소의 높이를 지정하면서 동시에 내부의 텍스트를 박스의 가운데(위와 아래의)에 배치할 수 있는 방법이 됩니다.

<style type="text/css"> .area p{line-height: 1.6;} </style>