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

IE6下CSS限制图片最大宽度和高度的方法

来源:IT技术网编辑:叶小叙发布于:2013-07-24人围观CSS图片IE6宽度

在IE7以上的IE浏览器、FF以及chrome中限制最大高度和最大宽度很容易,只需要用max-height、max-width,但IE6下却不认min-*和max-*。那么该怎么解决img在IE6下用CSS限制最大高度、最大宽度呢?
 方法一:
用JS控制。这个确实可行,网上也有挺多的例子,有兴趣的童鞋可以百度一下,这里就不说了。不过个人觉得麻烦。
这里重点介绍第二种,用CSS控制。不过说实在的,这里也算是CSS+JS实现的。只是用到CSS中的expression把JS放到CSS中执行了。
 方法二:
代码如下:
只限制最大宽度:
_width:expression(function(el){el.style.width=el.clientWidth > 140 ? "140px" : "auto";}(this));
也可以这样写(这种方法似乎更简单点):
_width:expression(this.width > 140 ? "140px" : this.width);
只限制最大高度:
_height:expression(function(el){el.style.height=el.scrollHeight > 135? "135px" : "auto";}(this));
如果是高度、宽度都要限制的话得同时用:
_width:expression(this.clientWidth>140?(function(el){el.style.width=el.clientWidth/el.clientHeight>140/135?"140px":"auto";})(this):"auto");
 _height:expression(this.clientHeight>135?(function(el){el.style.height=el.clientWidth/el.clientHeight<140/135?"135px":"auto";})(this):"auto");
 注:这里的clientHeight跟scrollHeight似乎都一样。

CSS,图片,IE6,相关的文章
有时间的话来看看IT界的突发事件