兼容各浏览器的css设置最大宽度和高度

<script type="text/javascript"> 
Object.MAX_WIDTH = 300; 
Object.MAX_HEIGHT = 130; 
</script>

<style type="text/css"> 
   #pic{ 
    max-width:300px; 
    max-height:130px; 
    width: expression(this.width > Object.MAX_WIDTH && this.width / Object.MAX_WIDTH >= this.height / Object.MAX_HEIGHT ? Object.MAX_WIDTH : true); 
    height: expression(this.height > Object.MAX_HEIGHT && this.width / Object.MAX_WIDTH < this.height / Object.MAX_HEIGHT ? Object.MAX_HEIGHT : true); 
   } 
</style>

上面方法测试可用,还有两种方法未测试

方法一
.resize img { width: expression(this.width > 680 ? 680 : true); max-width: 680px; height: expression(this.height > 500 ? 500 : true); max-height:680px;}

方法二
.resize img {max-width: 680px;max-height: 680px;} /* for Firefox & IE7 */
* html .resize img { /* for IE6 */
width: expression(this.width > 680 && this.width > this.height ? 680 : true);
height: expression(this.height > 500 ? 500 : true);
}


你可能感兴趣的:(兼容各浏览器的css设置最大宽度和高度)