设定网页最小最大宽度和高度（兼容IE6）
http://www.cnblogs.com/double-bin/archive/2011/12/19/2293093.html
?
/* 最小寬度 */
.min_width{min-width:300px;
? /* sets max-width for IE */
? _width:expression(document.body.clientWidth < 300 ? "300px" : "auto");
}
/* 最大寬度 */
.max_width{
? max-width:600px;
? /* sets max-width for IE */
? _width:expression(document.body.clientWidth > 600 ? "600px" : "auto");
}
/* 最小高度 */
.min_height{
? min-height:200px;
? /* sets min-height for IE */
? _height:expression(this.scrollHeight < 200 ? "200px" : "auto");
}
/* 最大高度 */
.max_height{
? max-height:400px;
? /* sets max-height for IE */
? _height:expression(this.scrollHeight > 400 ? "400px" : "auto");
}?
/* 最大最小寬度 */
.min_and_max_width{
? min-width:300px;
? max-width:600px;
? /* sets min-width & max-width for IE */
? _width: expression(
??? document.body.clientWidth < 300 ? "300px" :
?????? ( document.body.clientWidth > 600 ? "600px" : "auto")
? );
}?
/* 最大最小高度 */
.min_and_max_height{
? min-height:200px;
? max-height:400px;
? /* sets min-height & max-height for IE */
? _height: expression(
??? this.scrollHeight < 200 ? "200px" :
????? ( this.scrollHeight > 400 ? "400px" : "auto")
? );
}
?另插一條限定圖片最大寬度和高度的代碼，僅供參考，其實與上述同源同理。
Html代碼??
這里是結合css和其支持的expression實現的，示例代碼如下：??
<title>控制圖片的最大高寬</title>??
??<style?type="text/css">??
?????? .clear{clear:both;}??
.widthimg{width:?expression(this.width?>?200???'200px':?true);?max-width:?200px;?}??
</style>????
<body>??
<div?class="clear">??
<img?class="widthimg"?src="../image/mm.jpg"?/>??
</div>??
<div?class="clear">??
<img?src="../image/xx7.jpg"?/>??
</div>??
</body>??
?</html>??
?<head>??
<style?type="text/css">?????
<!--??
img.pic{?????
max-width:300;??
max-height:100px;???
/*由于IE6.0以及以前版本的IE不支持上邊兩個屬性,所以加上以下兩條語句.這里要說明的是expression只有IE支持*/????
width:?expression(this.width?>?300?&&?this.width?/?300?>=?this.height?/?100???300?:?true);????
height:?expression(this.height?>?100?&&?this.width?/?300?<?this.height?/?100???100?:?true);???
}???
//-->????
</style>??
?</head>???
<body>???
<div?id="pic">????
</div>???
<img?class="pic"?src="Blue?hills.jpg"?/>???
</body>???
</html>??
由于上邊的代碼中,設置最大的長寬是直接用數字的,這樣再修改的時候十分不方便,所以做了以下修改:????
<html>???
<head>??
<script?type="text/javascript">??
<!--??
Object.MAX_WIDTH?=?400;??
Object.MAX_HEIGHT?=?300;??
-->????
</script>???
<style?type="text/css">????
<!--???
img.pic{????
max-width:300px;??
max-height:100px;??
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>??
</head>??
<body>???
<div?id="pic">????
</div>???
<img?class="pic"?src="Blue?hills.jpg"?/>???
</body>??
</html>??
這樣的話,只需要修改Object.MAX_WIDTH和Object.MAX_HEIGHT這兩個類變量就可以很方便的修改最大的長寬.
轉載于:https://www.cnblogs.com/mmcmmc/p/4064824.html
總結
以上是生活随笔為你收集整理的设定网页最小最大宽度和高度（兼容IE6）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Eclipse快捷键 10个最有用的快捷
- 下一篇： 在一个数组中找 差值最大的两个数