줄 높이 바꾸는 방법 - line-height
line-height
문단의 첫 줄을 넘어 두 줄 이상되면 '줄 간격'이 생깁니다. 그런데 줄 간격은 너무
좁으면 글의 내용이 눈에 들어오지 않습니다. 이때 line-height 속성을 이용하면
원하는 만큼 줄 높이를 조절할 수 있습니다.
기본형
line-height : normal | length | number | percentage- normal : 웹브라우저에서 정한 기본값입니다. 보통 1.2입니다.
- length: 길이로 줄 높이를 정합니다.
- number : 글자 크기의 몇 배인지로 줄 높이를 정합니다.
- percentage : 글자 크기의 몇 %로 줄 높이로 정합니다.
예제
줄 높이가 글자 크기보다 크면 글자 위와 아래에 여백이 생깁니다. 줄 높이가 글자
크기보다 작으면 글자가 겹치게 됩니다.
data-default-tab="result"
data-preview="true"
data-editable="true"
data-height="1000"
data-pen-title="CSS 줄 높이 정하는 방법 line-height 예제"
data-slug-hash="LYNvvoj"
data-theme-id="light"
data-user="LiveBlogger"
style="align-items: center; border: 2px solid; box-sizing: border-box; display: flex; height: 1000px; justify-content: center; margin: 1em 0px; padding: 1em;"
>
로딩 중... 잠시만 기다려주세요.
자바스크립트를 허용해주세요.