HTML5 移动端网页制作中，如果有一个头部header大小是2rem 下方有一个div如何占满屏幕剩余位置
4个回答
展开全部
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>高度自适应</title>
<style>
* {
border: 0;
margin: 0;
box-sizing: border-box;
}
html, body, #all {
height: 100%;
}
#all {
border: 5px solid #aaa;
overflow: hidden;
}
#head {
height: 2rem;
background-color: aliceblue;
}
#main {
height: 100%;
background-color: antiquewhite;
}
</style>
</head>
<body>
<div id=all>
<div id=head>head</div>
<div id=main>main</div>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
用绝对定位就可以了
.main {
position : absolute;
top : 2rem; /* header的高度(包含边框,margin) */
left : 0;
bottom : 0;
right : 0;
}
/* .main的父级 */
.main-parent {
position:relative; /* 也可以是absolute;根据自己的实际情况定 */
}
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
.main{height:100VH;width:100VW;margin-top:-2rem;}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
width：100%；
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
