展开页面设置html和css

我正在构建一个新的博客，它在内容div中包含注释部分。目前，我已经为下面给出的正文，标题，导航，内容和页脚设置了我的CSS。展开页面设置html和css

内容div将根据正在撰写的评论数量进行扩展。如何设置内容div的css/html，以便在更多的评论数量（例如： - 200）时页面将自动展开。现在，我已经设置了宽度和高度为100％

html, body { 
    height: 100%; 
    width: 100%; 

} 

#header { 
    background-color:red; 
    height:10%; 
    margin-bottom:1%; 
} 
#naigator { 
    background-color:red; 
    height:5%; 
    margin-bottom:1%; 
} 

#content { 
    background-color:red; 
    height:75%; 
    margin-bottom:1%; 
} 

#footer { 
    background-color:red; 
    height:10% 
}

来源

2014-12-11 user1050619

请提供你是什么的图像或视频试图实现。 – Zaqx 2014-12-11 04:29:58

不要在内容元素上定义高度，以便根据内容元素的内容自动展开。另外，如果你想要冗长，你可以设置'height：auto;'。 – Sgnl 2014-12-11 04:56:26

变化content的高度风格min-height：

function addContent() { 
 
    var content= document.getElementById('content'); 
 
    content.innerHTML = content.innerHTML+'testing &hellip; '; 
 
    if(content.innerHTML.length < 5000) { 
 
    setTimeout(addContent,10); 
 
    } 
 
}

html, body { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px; 
 
} 
 

 
#header { 
 
    background-color:#fed; 
 
    height:9%; 
 
    margin-bottom:1%; 
 
} 
 

 
#navigator { 
 
    background-color:#def; 
 
    height:4%; 
 
    margin-bottom:1%; 
 
} 
 

 
#content { 
 
    background-color:yellow; 
 
    min-height:74%; 
 
    margin-bottom:1%; 
 
    font: 20pt verdana; 
 
} 
 

 
#footer { 
 
    background-color:#fed; 
 
    height:10%; 
 
}

<div id="header"> 
 
    <button onclick="addContent()">Add Content</button> 
 
</div> 
 
<div id="navigator"></div> 
 
<div id="content"></div> 
 
<div id="footer">Footer</div>

来源

2014-12-11 05:20:39

展开页面设置html和css

回答

相关问题