ie6兼容min-width跟min-height

来源：互联网发布：ieee69节点配电网数据编辑：程序博客网时间：2024/05/18 09:58

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ie6兼容min-width跟min-height</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<style type="text/css">
.demo_1{
min-height: 600px;
min-width: 600px;
border: 1px dashed #000;
}
.demo_char{
display: block;
_display: none;
}
.demo_char_6{
display: none;
_display: block;
}
.demo_char_6_1{
display: none;
_display: block;
}

.demo_ie6{
margin-top:50px;
display: none;
_display: block;
border: 1px dashed #000;
_width:expression((document.documentElement.clientWidth||document.body.clientWidth)<600?"600px":"");
_height:expression((document.documentElement.clientHeight||document.body.clientHeight)<600?"600px":"");
}
</style>
</head>

<body>
<h1>ie6兼容min-width跟min-height</h1>
<p>在实际使用中，有时候需要设定最小值，但ie6没有min-width跟min-height属性</p>
<div class="demo_1">
<div class="demo_char">
我是比ie6高级的浏览器，我的最小宽度是600px 最大高度是600px，不信你可以把窗口拉到小于600px，在下方立马有滚动条！
</div>
<div class="demo_char_6">
我是ie6浏览器，因我没法解析min-width 跟 min-height ，所以走默认样式，拉小窗口，我一点改变都没有,我的宽度还是100%，窗口是多宽，我就多宽。
</div>

</div>
<div class="demo_ie6">
<div class="demo_char_6_1">
我是ie6浏览器我使用了 <font color="red">expression</font> ，所以实现了 min-width 跟 min-height的功能，窗口变小后，我的最小宽度为600px.
<br>
<font color="red"> IE6支持下划线，IE7和firefox均不支持下划线。可以使用这点小区别，来给ie6设定样式 </font><br>
<font color="red">_width</font>:<font color="red">expression</font>((document.documentElement.clientWidth||document.body.clientWidth)<600?"600px":"");<br>
_height:expression((document.documentElement.clientHeight||document.body.clientHeight)<600?"600px":"");
<br>
<br>
CSS中使用expression有ie才能识别。IE5及其以后版本支持在CSS中使用expression，用来把CSS属性和Javascript表达式关联起来，<br>这里的CSS属性可以是元素固有的属性，也可以是自定义属性。就是说CSS属性后面可以是一段Javascript表达式，CSS属性的值等于Javascript表达式计算的结果。在表达式中可以直接引用元素自身的属性和方法，也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。
</div>
</div>
</body>
</html>