Web前端新人笔记之height、min-height的区别-来治猩猩的我

 浏览器参照基准：Firefox, Chrome, Safari, Opera, IE；
　　* IE6不支持CSS min-height属性。最小高度的定义：1. 元素拥有默认高度；2. 当内容超出元素的默认高度时，元素的高度随内容增加而增加
Figure 1:如下图的需求

　　* 如上图，两个区域的高度不一样。这就是 min-height 的效果演示。元素拥有一个默认的高度，当内容超出该默认高度时，元素的高度同时随内容而增加。

eg1:


class="test">喝水为什么会中毒？
class="test">喝水为什么会中毒？
日前有媒体报道称日饮用3升水年轻10岁，于是有人真开始喝了，可喝了4天后，尿血了。水是生命之源，但是不是喝水越多越好呢？喝水多了又会发生什么呢？

　* 如上代码，我们只需要一行代码 min-height:80px; 就可以实现非IE6浏览器的最小高度。

.test{
 height:80px; /* 看看ie6会如何 */
}

Figure 4:大获全胜的场景
.test{
 min-height:80px; /* for ie7+, firefox, chrome, safari, opera */
 _height:80px; /* for ie6 */
}