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教程(2):网页边框半径和网页圆角
Apr 02 HTML / CSS
CSS3 网页下拉菜单代码解释 中文翻译
Feb 27 HTML / CSS
css3实现input输入框颜色渐变发光效果代码
Apr 02 HTML / CSS
纯css3实现走马灯效果
Dec 26 HTML / CSS
利用CSS3的border-radius绘制太极及爱心图案示例
May 17 HTML / CSS
css3 media 响应式布局的简单实例
Aug 03 HTML / CSS
CSS3 二级导航菜单的制作的示例
Apr 02 HTML / CSS
CSS3实现苹果手机解锁的字体闪亮效果示例
Jan 05 HTML / CSS
html5 div布局与table布局详解
Nov 16 HTML / CSS
HTML5 3D旋转相册的实现示例
Dec 03 HTML / CSS
amazeui页面分析之登录页面的示例代码
Aug 25 HTML / CSS
HTML5 drag和drop具体使用详解
Jan 18 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 pack与unpack 摸板字符字符含义
2009/10/29 PHP
PHP convert_uudecode()函数讲解
2019/02/14 PHP
php和asp语法上的区别总结
2019/05/12 PHP
PHP Redis扩展无法加载的问题解决方法
2019/08/22 PHP
PHP实现创建一个RPC服务操作示例
2020/02/23 PHP
为什么要在引入的css或者js文件后面加参数的详细讲解
2013/05/03 Javascript
js获取多个tagname的节点数组
2013/09/22 Javascript
JS获取URL中的参数数据
2013/12/05 Javascript
javascript格式化日期时间方法汇总
2015/06/19 Javascript
jquery实现仿新浪微博带动画效果弹出层代码(可关闭、可拖动)
2015/10/12 Javascript
JS简单模拟触发按钮点击功能的方法
2015/11/30 Javascript
js密码强度实时检测代码
2016/03/02 Javascript
Dojo获取下拉框的文本和值实例代码
2016/05/27 Javascript
JavaScript实现父子dom同时绑定两个点击事件,一个用捕获,一个用冒泡时执行顺序的方法
2017/03/30 Javascript
vue组件jsx语法的具体使用
2018/05/21 Javascript
vue组件name的作用小结
2018/05/23 Javascript
小程序获取周围IBeacon设备的方法
2018/10/31 Javascript
vue组件间的参数传递实例详解
2019/04/26 Javascript
为python设置socket代理的方法
2015/01/14 Python
python使用jieba实现中文分词去停用词方法示例
2018/03/11 Python
Python 3.7新功能之dataclass装饰器详解
2018/04/21 Python
tensorflow 获取模型所有参数总和数量的方法
2018/06/14 Python
深入分析python中整型不会溢出问题
2018/06/18 Python
Python3最长回文子串算法示例
2019/03/04 Python
TensorFlow实现从txt文件读取数据
2020/02/05 Python
经济与贸易专业应届生求职信
2013/11/19 职场文书
教师个人剖析材料
2014/02/05 职场文书
倡导文明标语
2014/06/16 职场文书
文员转正自我鉴定怎么写
2014/09/29 职场文书
社区党员干部承诺书
2015/05/04 职场文书
2016年11月份红领巾广播稿
2015/12/21 职场文书
销售会议开幕词
2016/03/04 职场文书
读《方与圆》有感:交友方圆有度
2020/01/14 职场文书
SQL Server2019数据库之简单子查询的具有方法
2021/04/27 SQL Server
django 认证类配置实现
2021/11/11 Python
html中两种获取标签内的值的方法
2022/06/16 jQuery