IE 中的最大最小寬度和高度 css 高度 (兼容版本)

最新推荐文章于 2020-06-11 22:42:28 发布

原创最新推荐文章于 2020-06-11 22:42:28 发布 · 176 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#CSS

CSS 专栏收录该内容

1 篇文章

订阅专栏

本文详细介绍了使用CSS实现响应式布局中宽度和高度的限制技巧，包括最小宽度、最大宽度、最小高度和最大高度的设置方法，并通过JavaScript表达式确保浏览器兼容性。

/* 最小寬度 */
.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"));
}