如何实现div的高度100%填充

Posted 2020-12-03 whs5280

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何实现div的高度100%填充相关的知识，希望对你有一定的参考价值。

就我们所以了解的：一个div块级元素没有主动为其设置宽度和高度，浏览器会为其分配可使用的最大宽度(比如全屏宽度)，但是不负责分配高度，块级元素的高度是由子元素堆砌撑起来的。

例如：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        html,body{
            margin: 0;
            padding: 0;
        }
        .demo{
            width: 100%;
            height: 100%;
            background-color: #D9C666;
        }
    </style>
</head>
<body>
    <div class="demo">
        看看我的高度
    </div>
</body>
</html>