javascript和JQuery焦点图和代码特效大全
当前最流行的开源CMS网站系统大全
当前位置:主页 > WEB前端 > CSS-HTML >

如何让IE6支持min-height与max-height?

来源:IT技术网编辑:素还真发布于:2013-06-17人围观IE6min-heightmax-height

首先是如何让ie6支持min-height?

如果只是让ie6支持min-height倒也比较简单。一些朋友看过代码就能明白,主要是css hack方法,利用ie6支持或者不支持的符号来完成任务。

方法一:

<style type="text/css">
.show{background:#ccc;min-height:100px;_height:100px;}
</style>
<div class="show">牛魔王的世界观测试御用文字!</div>

方法二:

<style type="text/css">
.show{background:#ccc;height:auto!important;height:100px;min-height:100px; }
</style>
<div>牛魔王的世界观测试御用文字!</div>

方法三:(IT技术网不推荐使用)

<style type="text/css">
.show{background:#ccc;min-height:100px;_height:expression(this.scrollHeight < 100 ? "100px" : "auto");}
</style>
<div>牛魔王的世界观测试御用文字!</div>

上面提到的前两种方法原理都是一样的,让div块在ie6下高度固定为100px。第三种方法利用到了ie6的expression行为(主要是将css与js 表达式结合起来),我是极力不推荐这种写法,expression会占用大量浏览器资源。我也曾经遇到过使用了expression导致页面很卡的现象。

那么如何让ie6支持max-height?
一般max-height在实际应用中用到的比较少。在实战方面主要结合overflow来使用。如果让ie6支持max-height的方法同上面原理 相同,加“_height:高度;”。由于浏览器会自动把超出部分的内容显示出来,所以这里如果想要达到超出部分隐藏的话可以加上 “overflow:hidden;”,或者超出部分显示滚动条“overflow:auto;”

IE6,min-height,max-height,相关的文章
有时间的话来看看IT界的突发事件