在我的页面中，我既不知道页眉和页脚的高度。让页眉和页脚根据内容取其高度。
从我给内容部分提供的100％中重置高度。我正在尝试但没有得到结果。有人帮我吗？
html,body{
height:100%;
}
div.wrapp{
display:flex;
height:100%;
flex-flow: column wrap;
border:2px solid blue;
}
header{
flex:1;
width:100%;
border:1px solid red;
}
section{
flex:1;
height:100%;
}
footer{
flex:1;
width:100%;
}<div class="wrapp">
<header>asfsdf</header>
<section>sfasfsdf</section>
<footer>footer</footer>
</div>您可能希望section剩余高度：
/* unnecessary is commented out */
* {box-sizing: border-box}
html, body {
height: 100%; /* can also use viewport units (100vh) */
margin: 0;
}
div.wrapp {
display: flex;
height: 100%; /* same here */
flex-flow: column wrap;
border: 2px solid blue;
}
header {
/*flex:1;*/
/*width:100%;*/
border: 1px solid red;
}
section {
flex: 1; /* does the trick */
/*height:100%;*/
}
footer {
/*flex:1;*/
/*width:100%;*/
border: 1px solid red;
}<div class="wrapp">
<header>header</header>
<section>section</section>
<footer>footer</footer>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句