根据浏览器自适应div高度,我将高度设置成百分比后,依然无效

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #dd {
            width: 100%;
            height: 100%;
        }
        #dd1 {
            width: 20%;
            height: 20%;
            background-color: #F17A7A;
        }
    </style>
</head>
<body>

<div id="dd">
    <div id='dd1'>
        111
        222
        2222
    </div>
</div>

</body>
</html>
阅读 2.4k
4 个回答

dom对象的的css样式是继承父级的,所以需要把html,body的高度设置为100%div的高度才能100%自适应。

新手上路,请多包涵

html,body{

height: 100%;
width: 100%;

}

#dd {
            width: 100vw;
            height: 100vh;
        }
        #dd1 {
            width: 20vw;
            height: 20vh;
            background-color: #F17A7A;
        }
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题