CSS line-height란?

[css-tip]CSS line-height란?

줄 간격 설정이다.

인라인 요소의 높이를 설정하는 값으로 즉 줄 간격 설정이다.
만약 블록 레벨 요소에 값을 지정한 경우에는 해당 박스에 포함될 인라인 요소 박스의 최소 높이를 지정하는 것이 된다.

설정 값은 하위 요소로 상속된다.

※ IE7과 Firefox2에서 인라인 요소에 대한 기본 높이값의 차이가 많이 나기기 때문에 상위레벨(body 등)에서 픽셀이나 포인트로 결정해 주는 것이 좋다.

normal
: 기본값. 기본 크기

크기 및 단위(px,em,pt,%) : 크기 지정 예>10px, 10em, 10pt, 10%
- 백분율(%)은 부모 요소를 기준으로 계산된다.

inherit
: 부모 요소의 값을 상속하도록 지정한다.(IE6, IE7 지원 안한다.)

기본값은 normal이며, 브라우저가 적절한 줄간격을 설정한다.
(실수값+단위 형태"로 지정할 수 있다.)

전각(em)의 경우는, 해당 글꼴의 줄 간격을 1로 간주하고 백분율(%)은 100%로 간주하고 계산된다. 즉, 상위레벨의 값을 1(em), 100(%)으로 계산하여 표현한다. 픽셀(px) 및 포인트(pt)등과 같은 값을 지정할 수도 있다. 단, 인라인 레벨의 박스 높이인 만큼 음수값을 지정할 수 없다.