设置基础宽高后并添加绝对位置定位 position 为 fixed 和 bottom 为 0；
以上便是此次分享的全部内容，希望能对大家有所帮助！
1、首先新建一个html页面，然后在这个html代码页面创建一个<div>标签，同时给这个<div>添加一个class类为footer。
2、然后设置footer类，把div固定在底部。创建<style>标签，在该标签内设置通过position:fixedbottom:0设置footer类样式，把div固定在底部。
css样式代码：
.footer{
height:100px
width:100%
background-color:#ddd
position:fixed
bottom:0
}
3、保存html代码，然后使用浏览器打开即可看到不管如何放大缩小浏览器div都是固定在底部的。
html代码<body>
<DIV id="container">
<DI id="content">
<h1>Content</h1>
<p>请改变浏览器窗口的高度，以观察footer效果。</p>
<p>这里是示例文字，DIV固定………，这里是示例文字。</p>
</DIV>
<DIV Vid="footer">
<h1>Footer</h1>
</DIV>
</DIV>
</body>
CSS代码：
程序代码
body,html{
margin:0
padding:0
font:12px/1.5arial
height:100%
}
#container{
min-height:100%
position:relative
}
#content{
padding:10px
padding-bottom:60px
/*20px(font-size)
x2(line-height)+10px(padding)x2=60px*/
}
#footer{
position:absolute
bottom:0
padding:10px0
background-color:#AAA
width:100%
}
#footerh1{
font:20px/2Arial
margin:0
padding:010px
}
