html 盒子总高度高度,CSS中DIV盒子设置最小高度值并自适应高度

一般来说，想让一个DIV盒子的高度能够根据盒子内的内容自动调整，不设置盒子的高度值(height)就行了。

但还有一种情况：为了使盒子布局美观，需要对盒子设置一个初始高度，当盒子中的内容很少时，保持这个初始高度，如果内容超过该盒子初始高度的容量，则盒子的高度根据内容自动调整增高。所以这时需要设置一个具体的DIV盒子高度值，又要使其能够在超过初始高度时自适应。

具体解决办法是(假设DIV盒子的初始高度是500px)：#columnMain{

min-height:500px;

height:auto !important;

height:500px;

}

这里，height:500px;适用于IE6，因为IE6不认识前两条CSS语句，但height:500px;对IE6足够了，因为IE6的渲染办法是当已设置的实际高度不够用时，会自动撑开盒子的高度；前两条CSS语句min-height:500px;height:auto !important;是对IE7+、Chrome、FF和Oprea用的，这些版本的浏览器使用min-height:500px;设置了最小高度，如果超过了最小高度，则使用height:auto !important;自动调整高度，注意这条CSS语句中有!important，所以它的优先性是超过其后的height:500px;的。

至此，问题解决。