首页 > 代码库 > 紧贴底部的页脚
紧贴底部的页脚
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"> <title>doc01</title> <style> * { padding:0; margin:0; } /*带有缺陷的解决方法*/ /*body {*/ /*width:90%;*/ /*margin: 0 auto;*/ /*}*/ /*.wrapper {*/ /*min-height:calc(100vh - 3em);*/ /*background-color: antiquewhite;*/ /*}*/ /*更好的解决方法*/ body { display: flex; /*flex-flow: column;*/ min-height: 100vh; } .wrapper { flex: 1; } .footer { background-color: grey; } </style></head><body><div class="wrapper"> <header class="header"> <h1>site name</h1> </header> <div class="main"> <p> footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部 footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部 footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部 footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部footer紧贴底部 </p> </div></div><footer class="footer"> <p>© 2015 No rights reserved.</p> <p>Made with ♥ by an anonymous pastafarian.</p></footer></body></html>
以上代码参考《css揭秘》，神奇的一本书。
紧贴底部的页脚
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。