div如何高度自适应延伸到浏览器底部

本文转载自查看原文 2020-03-27 23:28 1455 HTML5/CSS3

方法1：

<html>
<head>
    <title></title>
    <script language="javascript" type="text/javascript">
        window.onload = function() {
            var div = document.getElementById("csdn");
            div.style.position = "absolute";
            div.style.top = "0";
            div.style.height = document.documentElement.clientHeight;
        }
  </script>

</head>
<body>
 <div id="csdn" style="background-color: #FF0000; width: 200px;">
  1234567890-=<br />
  1234567890-=<br />
 </div>   
</body>
</html>

2. 方法2

方法1在有些场合还是无法解决问题，

var height = document.documentElement.scrollHeight;
                          if (height > 30) {
                              height = height - 30;
                              $("body").css('height', height);
                          }
                      }

这里使用了 document.documentElement.scrollHeight

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 css 控制div高度自适应浏览器的高度 jquery实现div自适应浏览器高度（宽度） div 自适应浏览器高度方式 React里单页面div自适应浏览器高度占满屏幕 jquery让页面中的模块自适应浏览器高度实现自适应位置--footer紧贴浏览器底部实现不同分辨率、不同浏览器下高度自适应、iframe高度自适应 EasyUI设置Layout自适应浏览器宽度和高度让div自适应浏览器窗口居中显示 html中图片自适应浏览器和屏幕，宽度高度自适应