我一直在练习如何创建模板。我的第一个问题是如果内容的长度不足以填满整个屏幕,如何将页脚粘贴在屏幕底部。使用本教程解决了这个问题http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page
我的另一个问题是如何将侧边栏一直填充到页脚。
这是html:
<div id="wrapper">
<div id="header">
header here
</div>
<div id="container">
<div id="sidebar">
sidebar here
</div>
<div id="content">
content here
</div>
</div>
<div class="cls"></div>
<div id="footer">
footer here
</div>
</div>
这是CSS:
body{
padding: 0;
margin: 0;
}
.cls{
clear:both;
}
#wrapper{
min-height: 100%;
position: relative;
}
#header{
background-color: #DDDDDD;
height: 60px;
}
#container{
padding-bottom: 60px;
width: 100%;
}
#sidebar{
background-color: #87CEFA;
width: 220px;
float: left;
padding-right: 20px;
}
#content{
width: 75%;
float:right;
}
#footer{
background-color: #CCCCCC;
bottom: 0;
position: absolute;
width: 100%;
height: 60px;
}
打开图片链接,左侧的那个就是我现在所拥有的……我希望结果是右侧的 http://www.4shared.com/photo/CoXrUWP2/template.html