min-height用于设置或检索对象的最小高度,为CSSer不可缺少和重要的一个属性。对于Firefox、safari、opera、 Chrome及一些以Trident为内核的山寨浏览器有非常好的支持性,但比较操蛋为它只适应IE6+,对此我们开始抓狂,纠结,暴疯。对此为满足更多 IE6用户也能正常显示,自已总结了三个不同方法页面例子,都可实现兼容的hack处理。
min-height兼容案例一
- min-height:160px; 设置对象box的最小高度,Firefox、IE7+适用;
- height:expression.. 设置CSS属性和JS表达式关联,IE5+支持expression
预览: http://byzuo.cn/demo/minHeight/demo_01.html
min-height兼容案例二
- min-height:160px; 设置对象box的最小高度,Firefox、IE7+适用;
- height:auto!important; 设置对象box的高度无自动定位,使用!important对下height高度定位设置进行优先级提升;
- heigt:160px; 设置对象高度,因上属性!important运用,此属性只有IE6认。
预览: http://byzuo.cn/demo/minHeight/demo_02.html
min-height兼容案例三
- min-height:160px; 设置对象box的最小高度,Firefox、IE7+适用;
- height:auto; 设置对象box的高度无自动定;
- _heigt:160px; 设置对象高度,此属性只有IE6认,在IE6下此属性覆盖上auto属性。
预览: http://byzuo.cn/demo/minHeight/demo_03.html
虽然在IE5+在CSS可支持expression,但因为expression对浏览器资源要求比较高,一般不建议使用expression,所以综合起来案例二、案例三为推荐使用。
但当对于图片宽高自适应的特性,用以上方法没办法实现的情况下,不得以我还是会选择expression。下为非得以而为之expression的例子。
预览: http://www.byzuo.cn/demo/auto_width_height/