[box] CSS - min-height 속성 - 최소높이 (= 최소세로길이 = min-height속성 = 민하이트속성)

1. min-height 예제 - 최소 높이
2. min-height 정의
3. min-height 구문

min-height 예제 - 최소 높이

 

<style>

p {background-color: yellow;}

p.hz {background:tomato; min-height: 100px;}

</style>

<p>홈짱닷컴 Homzzang.com</p>

<p class="hz">홈짱닷컴 Homzzang.com</p>

 

결과보기

min-height 정의

 

요소의 최소 높이 지정.

 

---

 

1.

내용 height < min-height : min-height 적용.

내용 height > min-height : 내용 height 적용.

 

즉,

height가 min-height보다 작아지는 걸 막아줌.

 

2.

기본값: 0

상속여부: X

애니효과: O

CSS버전: CSS2 

JS구문: object.style.minWidth="400px";

 

3.

IE7이상 주요 최신브라우저 지원.

 

4.

inline 요소 경우엔 min-width 속성값 적용 X.

(즉, display:inline-block 또는 display:block 속성 이용해 block 레벨로 바꿔줘야 적용됨.)

 

min-height 구문

 

selector {min-height: length|initial|inherit;}

 

---

[속성값]

 

length

px, cm 등의 길이 단위 숫자. (기본값: 0)

 

initial

이 속성의 기본값으로 자동 설정.

 

inherit

부모요소의 속성값 상속.