zoukankan      html  css  js  c++  java
  • 让body的clientHeight与html的clientHeight相等的方法

    body元素是自适应高度的块级元素,当页面内容比较少时,它的高度会小于默认浏览器的可是区域高度;html元素的高度是默认等于浏览器视窗的高度的

    从文档结构上来说 body是html的子元素,按道理设置body{ height:100%;},可以让它和html元素高度相等,实际发现没没效果。需要设置 html,body{height:100%}才能让两者的高度相等

    测试代码如下:

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    html{height:100%; background:yellow;}
    body{height:100%; background:#eee;}
     .pos{background:blue; height:300px; border:1px solid red; }
     .hi{background-image:url("s.jpg"); background-repeat:no-repeat; background-position:20px 40px; }
    </style>
    </head>
    <body>
    <p class="pos hi">some text here </p>
    <script>
    alert(document.documentElement.clientHeight);
    alert(document.body.clientHeight);
    </script>
    </body>
    </html>
  • 相关阅读:
    山屋惊魂 · 大模拟 · 码长破千 · 祭
    CSP-S 模拟92
    CSP-S 模拟91
    关于我
    CSP-S 模拟76
    [2020 年联考 A 卷] HEOI 2020 退役记
    csp-s 2019 退役记
    论人贵有自知之明的重要性
    [NOI2018] 你的名字
    HDU 3446 daizhenyang's chess
  • 原文地址:https://www.cnblogs.com/stephenykk/p/3056585.html
Copyright © 2011-2022 走看看