sticky footer ,它可以概括如下:如果页面内容不够长的时候,页脚块粘贴在视窗底部;如果内容足够长时,页脚块会被内容向下推送。
html如下:
<div class="container">
<div class="content-wrapper clearfix">
<div class="content-main">
content
</div>
</div>
<div class="content-close">
<i class="icon-close"></i>
</div>
</div>
css如下
.container{
position: fixed
top: 0
left: 0
z-index: 100
width: 100%
height: 100%
background: rgba(7,17,27,0.5)
}
.content-wrapper{
min-height: 100%
}
.content-main{
margin-top: 64px
padding-bottom: 64px
}
.content-close{
position: relative
width: 32px
height: 32px
margin: -64px auto 0 //数值跟内容区的padding-bottom一致
clear: both
font-size: 32px
}