/images/white/buttonHelp.gif){kind=small}
/images/white/iconAllTags.gif){kind=small}
Line - Height
개요 : 이 속성은 요소의 줄높이(행간, 글자 높이)를 지정한다.
line-height와 font-size 값의 차이는 리딩(leading)이하고 하며, 리딩의 절반은 요소의 내용 영역이나 글자 줄의 위와 아래에 동일하게 적용된다.
정의
line-height | 설명 |
값 | normal | <수치> | <길이> | <백분율> | inherit |
기본값 | normal |
적용대상 | 모든 요소 |
상속 | 됨 |
백분율 | 자신의 글꼴 크기 참조 |
미디어 | visual |
값
값 | 설명 |
normal | 기본 크기(1.0~1.2) 를 지정한다. |
<수치> | 단위를 포함하지 않은 수치를 지정한다. 수치에 글꼴 크기 곱해서 line-height가 지정된다. |
<길이> | 길이를 지정한다. |
<백분율> | 백분율 (%) 값을 지정한다. 부모 요소를 기준으로 계산된다. |
inherit | 부모 요소의 값을 상속하도록 지정한다. |
수치, 길이, 백분율에 음수값을 지정할 수 없다.
---------------------------------------------------------------------------------------------------
예제
View Source :
<style>
span {line-height: 1.2; background: yellow;}
</style>
<body>
<p>행간의 크기를 지정하지 않으면, 브라우저의 기본 스타일인 1~1,5(대부분 1.2)의 수치로 출력됩니다. 여기서 수치란 글꼴 크기의 배수입니다.</p> <p>행간의 크기를 <span>글꼴 크기의 3배</span>로 지정합니다.<p> <p>행간은 인라인 박스의 높이가 됩니다.</p> </body>
Result :
