<div id="father">

　　<footer></footer>

</div>

#father{

position:relative; //父元素加入相对定位  不加则固定到html底部

}

footer {
position: absolute;　　//绝对定位
bottom: 0;
left: 50%;　　//水平居中
transform: translate(-50%, 0%);　//调整位置
}

html css div固定底部的更多相关文章

  1. CSS Div固定在网页顶部、底部、左侧、右侧

    Div固定在网页顶部 .header { width:100%; height:80px; background-color:#FAFAFA; position:fixed; top:; left:; ...

  2. CSS div固定顶端

    position: fixed;原来只需要这么一个设置就可以!

  3. 内容高度小于窗口高度时版权div固定在底部

    <!doctype html><html><head><meta charset="utf-8"><title>文档内容 ...

  4. 设置一个div网页滚动时，使其固定在头部，当页面滚动到距离头部300px时，隐藏该div，另一个div在底部，此时显示；当页面滚动到起始位置时，头部div出现，底部div隐藏

    设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...

  5. jQuery&CSS 顶部和底部固定浮动工具栏 兼容IE6

    http://www.cnblogs.com/lhj588/archive/2013/04/02/2994639.html —————————————————————————————————————— ...

  6. div+css页面右侧底部悬浮层

    效果体验:http://hovertree.com/texiao/css/23/ 效果图: 代码如下: <!DOCTYPE html> <html> <head> ...

  7. CSS + DIV 让页脚始终底部

    一 前言 经常设计页面时用到三层DIV,头DIV与脚DIV一般固定高度,而中间层DIV根据内容的多少,高度不定,我们经常希望但内容很少时,脚DIV保持在底部,当内容很多时,脚DIV被中间内容挤到下面, ...

  8. CSS + DIV 让页脚始终保持在页面底部

    来源:David's Blog     http://www.DavidQiu.com/ 文章链接:http://blog.davidqiu.com/post/2013-06-17/400517539 ...

  9. div固定顶部和底部

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 【转载】ZYNQ Cache问题的解决方法

    Zynq Cache问题的解决方法 - Kevin_HeYongyuan - 博客园https://www.cnblogs.com/kevin-heyongyuan/articles/7738552. ...

  2. apache添加ssl协议实现用户认证

    目标 1对服务器的访问由http改为https, 2仅有证书的客户端可以访问服务器, 3.通过服务器端的配置,可以停用某个客户端的证书. 一 Apache服务器相关配置: 在../apache/con ...

  3. NOIP2018 填数游戏 搜索、DP

    LOJ 感觉这个题十分好玩于是诈尸更博.一年之前的做题心得只有这道题还记得清楚-- 设输入为\(n,m\)时的答案为\(f(n,m)\),首先\(f(n,m)=f(m,n)\)所以接下来默认\(n \ ...

  4. 「雅礼集训 2017 Day1」字符串 SAM、根号分治

    LOJ 注意到\(qk \leq 10^5\),我们很不自然地考虑根号分治: 当\(k > \sqrt{10^5}\),此时\(q\)比较小,与\(qm\)相关的算法比较适合.对串\(s\)建S ...

  5. [转] Vue原理解析——自己写个Vue

    一.Vue对比其他框架原理 Vue相对于React,Angular更加综合一点.AngularJS则使用了“脏值检测”. React则采用避免直接操作DOM的虚拟dom树.而Vue则采用的是 Obje ...

  6. LinkedList、ArrayList、Vector三者的关系与区别？

    LinkedList.ArrayList.Vector三者的关系与区别? 区分ArrayList,Vector,LinkedList的区别 ArrayList,Vector的区别: 1.出现版本:Ar ...

  7. ASP.NET中App_Data等文件夹的作用

    文件夹名称 文件类型  注 释  Bin .dll 包含应用程序所需的任何预生成的程序集 App_Browsers .browser 包含应用程序特有的浏览器定义文件,ASP.NET用它来识别各浏览器 ...

  8. CKEditor 4 上传图片

    参考资料:Basic Configuration 直接Ctrl+v(粘贴图片)报错信息:上传文件时发生网络错误(networkError:Network error occurred during f ...

  9. 全面了解Cookie

    一.Cookie的出现 浏览器和服务器之间的通信少不了HTTP协议,但是因为HTTP协议是无状态的,所以服务器并不知道上一次浏览器做了什么样的操作,这样严重阻碍了交互式Web应用程序的实现. 针对上述 ...

  10. 关于DataX

    1. 关于DataX 1.1. 前言 为什么写这篇文章,因为初出茅庐的时候,曾经遇到的一个面试官就是DataX的作者之一,而当时我还偏偏因为业务需求做了个数据库的同步工具,我当时不知道他做过这么专业的 ...