html部分

<div class="container">

<div class="body"></div>

<div class="footer"></div>

</div>

footer始终在其底部固定

.container{position:relative;width:100%;min-height:100%;}
.body{padding-bottom:50px;}

.footer{height:50px;position:fixed;bottom:0px;left:0px;right:0px;}

Html——footer的使用的更多相关文章

  1. 一个将 footer 保持在底部的最好方法

    原文: Quick Tip: The Best Way To Make Sticky Footers 当你在布局网页时,有可能会遇到类似下面的这种情况 导致这一问题的原因是页面内容太少,无法将内容区域 ...

  2. 解决Jquery mobile点击较长文本body的时候Header和footer会渐入渐出的问题

         在做一个Phonegap+Jqm工程的时候,出现了如题的问题,相信很多人都遇到过Jquerymobile点击body时候header和footer会闪烁的显示和隐藏问题,fixed却并不能真 ...

  3. CSS Sticky Footer

    ----CSS Sticky Footer 当正文内容很少时,底部位于窗口最下面.当改变窗口高度时,不会出现重叠问题. ----另一个解决方法是使用:flexBox布局  http://www.w3c ...

  4. 利用gulp解决前后端分离的header/footer引入问题

    在我们进行前后端完全分离的时候,有一个问题一直是挺头疼的,那就是公共header和footer的引入.在传统利用后端渲染的情况下,我们可以把header.footer写成两个单独的模板,然后用后端语言 ...

  5. 【技巧篇】解决悬浮的<header>、<footer>遮挡内容的处理技巧

    引言   在现在的前端页面中,尤其是移动端,经常会需要将<header>或者是<footer>模块悬浮出来,跟随页面的滑动保持定位在页面的最上方或者是最下方,如下图所示. “回 ...

  6. footer置底

    html代码: <div class="container"> <div cass="header"></div> < ...

  7. jquery mobile开发中footer一直在底部的设置方法

    现给出html中Body节点中的代码如下: 实现代码:data-position=”fixed” <div data-role="page" id="pageone ...

  8. ListView中动态显示和隐藏Header&Footer

    ListView的模板写法 ListView模板写法的完整代码: android代码优化----ListView中自定义adapter的封装(ListView的模板写法) 以后每写一个ListView ...

  9. 2015.4.19 为什么footer下a的索引值那么大

    1.问题demo:为什么footer下a的索引值那么大,index不是查找兄弟级别的元素么?而且还限定了范围在footer下的a的情况下. 解决方法:alert( $("#footer a& ...

  10. 解决jquery mobile的header和footer在点击屏幕的时候消失的办法

    给header和footer添加 data-position="fixed" 和 data-tap-toggle="false"即可,代码如下: <div ...

随机推荐

  1. （CodeForces 510C） Fox And Names 拓扑排序

    题目链接:http://codeforces.com/problemset/problem/510/C Fox Ciel is going to publish a paper on FOCS (Fo ...

  2. POJ 2559 Largest Rectangle in a Histogram -- 动态规划

    题目地址:http://poj.org/problem?id=2559 Description A histogram is a polygon composed of a sequence of r ...

  3. make menuconfig出错需要安装文件

    $ make menuconfig *** Unable to find the ncurses libraries or the *** required header files. *** 'ma ...

  4. ASP.NET MVC Web API使用示例

    上篇博客讲解rest服务开发时,曾经提到过asp.net mvc中的rest api,由于篇幅原因,没有在上篇博客中进行讲解,这里专门拿出来进行讨论.还是一样引用上次的案例,用asp.net mvc提 ...

  5. 线程池原理及创建并C++实现

    本文给出了一个通用的线程池框架,该框架将与线程执行相关的任务进行了高层次的抽象,使之与具体的执行任务无关.另外该线程池具有动态伸缩性,它能根据执行任务的轻重自动调整线程池中线程的数量.文章的最后,我们 ...

  6. jquery中交替点击事件toggle方法的使用示例

    jquery中交替点击事件toggle方法中有两个参数,分别是要交替执行的事件.如果不传参默认是显示隐藏功能,下面有个不错的示例,感兴趣的朋友可以参考下 复制代码代码如下: $('#clickId‘) ...

  7. Websocket协议之握手连接

    Websocket协议是为了解决web即时应用中服务器与客户端浏览器全双工通信的问题而设计的,是完全意义上的Web应用端的双向通信技术,可以取代之前使用半双工HTTP协议而模拟全双工通信,同时克服了带 ...

  8. java 中的 & | ~ ^ 运算符分析

    1．与运算符与运算符用符号“&”表示,其使用规律如下:两个操作数中位都为1,结果才为1,否则结果为0,例如下面的程序段.public class data13{public static vo ...

  9. Linux_Struct file()结构体

    struct file结构体定义在/linux/include/linux/fs.h(Linux 2.6.11内核)中,其原型是:struct file {        /*         * f ...

  10. Python之创建tuple

    tuple是另一种有序的列表,中文翻译为" 元组 ".tuple 和 list 非常类似,但是,tuple一旦创建完毕,就不能修改了. 同样是表示班里同学的名称,用tuple表示如 ...