Home  >  Article  >  Web Front-end  >  Compatible with min-width and min-height of IE6

Compatible with min-width and min-height of IE6

WBOY
WBOYOriginal
2016-08-18 08:57:561862browse

如果一个站是宽屏的,你左右拖动浏览器的窗口网站宽度会随着窗口的大小而改变,而浏览器窗口宽度减小到一定程度后就会出现下边的滚动条,网站宽度就不会再减小了,我们知道这一简单的功能用css的min-width就很容易能实现,但不幸的是,我们用户很多的IE6不支持这个非常方便的属性,怎么办呢,我们只要在网页设计时加上下面的css语句就能解决:

方法一:

height:auto!<span style="color: #000000;">important;
height:580px;
min</span>-height:580px;

把以上三行代码加到需要最小宽度的div里即可,原理是使用IE6本身的BUG(当块级元素内部的东西超出此块级元素的高度时,块级元素的高度会被撑开,也就是说IE6中的height属性本身就等同于min-height)。

方法二:

min-<span style="color: #000000;">height:200px;
_height:200px;</span>

方法三:

#min-<span style="color: #000000;">width{
    min</span>-<span style="color: #000000;">width:900px;
    _width:expression((document.documentElement.clientWidth</span>||document.body.clientWidth)&lt;900?"900px":""<span style="color: #000000;">);
    line</span>-<span style="color: #000000;">height:200px;
    background:#ccc;
}</span>

方法四:

<span style="color: #000000;">#mpage{
    width:</span>100%<span style="color: #000000;">;
    min</span>-<span style="color: #000000;">width:980px;
    position:relative;
    _width: expression(((document.compatMode </span>&& document.compatMode=='CSS1Compat')? document.documentElement.clientWidth : document.body.clientWidth) < 980? '980px' : 'auto'<span style="color: #000000;">); 
}</span>

 

 

心上四种方法任何一种都可解决IE6不支持min-width属性的问题,本站用的是第四种。

 

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn