JAVA高级面试进阶训练营视频教程

admin · 发表于 2021-5-13 13:12:19

上面红色部分为 height:100%; 自动拉伸到与父元素一样的高度。
在IE7 8 FF 等浏览器中通过position:absolute;可以使height:100%;正常显示，IE6下无效。
方法一：
使用CSS嵌入JS来实现。

_height:expression(document.getElementById('div2').offsetHeight+"px");

这句CSS只针对IE6有效。
测试:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312" />
<style>
#box{
    position:relative;
    border:1px solid #CCC;
    width:180px;
}

#div1{
    position:absolute;top:0;right:0;
    width:100px;
    border-left:1px solid #CCC;
    background:red;
    float:right;
    height:100%;
    _height:expression(document.getElementById('div2').offsetHeight+"px");
}
</style>
</head>
<body>

<div id="box">
    <div id="div1"></div>
    <div id="div2">
        1111<br/>
        1111<br/>
        1111<br/>
        1111<br/>
        1111<br/>
        1111<br/>
    </div>
</div>

</body>
</html>

方法二：
去掉HTML第一行的<!doctype> 声明，并且给父容器指定height属性。
测试:

<!--<!doctype html> 删掉这句-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312" />
<style>
#box{
    position:relative;
    border:1px solid #CCC;
    width:180px;
    height:150px;/* 给父元素指定height值 */
}

#div1{
    position:absolute;top:0;right:0;
    width:100px;
    border-left:1px solid #CCC;
    background:red;
    float:right;
    height:100%;
    /*_height:expression(document.getElementById('div2').offsetHeight+"px");*/
}
</style>
</head>
<body>

<div id="box">
    <div id="div1"></div>
    <div id="div2">
        1111<br/>
        1111<br/>
        1111<br/>
        1111<br/>
        1111<br/>
        1111<br/>
    </div>
</div>

</body>
</html>

		自动登录	找回密码
密码			立即注册

JAVA高级面试进阶训练营视频教程	Java架构师系统进阶VIP课程	分布式高可用全栈开发微服务教程	Go语言视频零基础入门到精通	Java架构师3期(课件+源码)
Java开发全终端实战租房项目视频教程	SpringBoot2.X入门到高级使用教程	大数据培训第六期全套视频教程	深度学习（CNN RNN GAN）算法原理	Java亿级流量电商系统视频教程
互联网架构师视频教程	年薪50万Spark2.0从入门到精通	年薪50万！人工智能学习路线教程	年薪50万大数据入门到精通学习路线	年薪50万机器学习入门到精通教程
仿小米商城类app和小程序视频教程	深度学习数据分析基础到实战	最新黑马javaEE2.1就业课程	从 0到JVM实战高手教程	MySQL入门到精通教程

JAVA高级面试进阶训练营视频教程

Java架构师系统进阶VIP课程

IE6 CSS高度height:100% 无效解决方法总结