CSS3 实现footer 固定在底部(无论页面多高始终在底部)


Posted in HTML / CSS onOctober 15, 2019

前言

把 footer 区固定在底部,无论页面高度多宽,它始终在底部不会变,就像移动端的菜单一样。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>document</title>

<!-- css -->
<style>
#demo{
 position: fixed;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 50px;
    background-color: #eee;
    z-index: 9999;
}
</style>

</head>
<body>
<footer id="demo">我是footer</footer>
</body>
</html>

总结

以上所述是小编给大家介绍的CSS3 实现footer 固定在底部(无论页面多高始终在底部),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

HTML / CSS 相关文章推荐
CSS3 box-sizing属性
Apr 17 HTML / CSS
实现CSS3中的border-radius(边框圆角)示例代码
Jul 19 HTML / CSS
CSS3属性background-size使用指南
Dec 09 HTML / CSS
CSS3实现曲线阴影和翘边阴影
May 03 HTML / CSS
CSS实现半透明边框与多重边框的场景分析
Nov 13 HTML / CSS
HTML5中FileReader接口使用方法实例详解
Aug 26 HTML / CSS
Html5之svg可缩放矢量图形_动力节点Java学院整理
Jul 17 HTML / CSS
HTML5 Canvas图像模糊完美解决办法
Feb 06 HTML / CSS
使用html5 canvas创建太空游戏的示例
May 08 HTML / CSS
html5中的一些标签学习(心得)
Oct 18 HTML / CSS
使用spring mvc+localResizeIMG实现HTML5端图片压缩上传的功能
Dec 16 HTML / CSS
基于HTML5 Canvas的3D动态Chart图表的示例
Nov 02 HTML / CSS
CSS实现雨滴动画效果的实例代码
Oct 08 #HTML / CSS
CSS3 @media的基本用法总结
Sep 10 #HTML / CSS
css3 伪类选择器快速复习小结
Sep 10 #HTML / CSS
css3进阶之less实现星空动画的示例代码
Sep 10 #HTML / CSS
CSS3 animation ? steps 函数详解
Aug 30 #HTML / CSS
移动端适配 使px自动转换rem
Aug 26 #HTML / CSS
CSS3 毛玻璃效果
Aug 14 #HTML / CSS
You might like
php基础知识:类与对象(1)
2006/12/13 PHP
关于svn冲突的解决方法
2013/06/21 PHP
PHP数组相关函数汇总
2015/03/24 PHP
PHP中static关键字以及与self关键字的区别
2015/07/01 PHP
PHP+swoole实现简单多人在线聊天群发
2016/01/19 PHP
jQuery(js)获取文字宽度(显示长度)示例代码
2013/12/31 Javascript
js完美解决IE6不支持position:fixed的bug
2015/04/24 Javascript
一起学写js Calender日历控件
2016/04/14 Javascript
Bootstrap框架动态生成Web页面文章内目录的方法
2016/05/12 Javascript
AngularJS入门教程之路由与多视图详解
2016/08/19 Javascript
AngularJS中的DOM操作用法分析
2016/11/04 Javascript
[原创]JS基于FileSaver.js插件实现文件保存功能示例
2016/12/08 Javascript
JavaScript简单验证表单空值及邮箱格式的方法
2017/01/20 Javascript
微信小程序canvas写字板效果及实例
2017/06/15 Javascript
JS中的两种数据类型及实现引用类型的深拷贝的方法
2018/08/12 Javascript
jQuery层叠选择器用法实例分析
2019/06/28 jQuery
jQuery实现获取多选框的值示例
2020/02/07 jQuery
[01:59]DOTA2首部纪录片《Free to play》预告片
2014/03/12 DOTA
[01:28:56]2014 DOTA2华西杯精英邀请赛 5 24 CIS VS DK
2014/05/26 DOTA
Python中endswith()函数的基本使用
2015/04/07 Python
浅谈Python单向链表的实现
2015/12/24 Python
利用python批量修改word文件名的方法示例
2017/10/17 Python
Python文本统计功能之西游记用字统计操作示例
2018/05/07 Python
python读取文本绘制动态速度曲线
2018/06/21 Python
Python any()函数的使用方法
2019/10/28 Python
春节到了 教你使用python来抢票回家
2020/01/06 Python
python 发送get请求接口详解
2020/11/17 Python
使用canvas一步步实现图片打码功能的方法
2019/06/17 HTML / CSS
Spartoo英国:欧洲最大的网上鞋店
2016/09/13 全球购物
任课老师推荐信范文
2013/11/24 职场文书
大学生个人推荐信范文
2013/11/25 职场文书
党员自我评价分享
2013/12/13 职场文书
2014年公务员思想汇报范文:全心全意为人民服务
2014/03/06 职场文书
乡镇挂职心得体会
2014/09/04 职场文书
涨价通知
2015/04/23 职场文书
工作态度检讨书范文
2015/05/06 职场文书