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

Compatible with min-width and min-height of IE6

WBOY
Release: 2016-08-18 08:57:56
Original
1872 people have browsed it

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

方法一:

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

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

方法二:

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

方法三:

#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>
Copy after login

方法四:

<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>
Copy after login

 

 

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

 

source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template