블로그

[CSS] 줄간격(행간) 조절하는 방법

탁이 2018. 7. 3. 15:53

CSS 를 이용해서 줄간격 (행간) 을 조절하는 방법을 소개합니다. 

css행간

행간 조절 CSS line-height :

문장의 줄간격(행간)을 조절합니다. 줄간격이 너무 좁으면 가독성이 떨어지게 되는데, 그런 경우  이 속성을 이용하여 줄간격을 조절할 수 있습니다.

행간을 조절하는 속성 line-height :

페이지 전체의 행간을 변경
body {line-height : 행간 값 }

단락 <p> </ p> 요소의 행간을 변경
p {line-height : 행간 값 }

클래스의 행간을 변경
.className {line-height : 행간 값 }

행간 값의 단위의 종류

% 지정 브라우저의 문자 기준 크기에 대한 % 값.
line-height : 150 %

em 지정 브라우저의 문자 기준 사이즈를 1em했을 때의 값.
line-height : 0.5em

px 지정 px 지정.
line-height : 5px