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. Windows Forms(二)

    导读 1.用VS创建一个Windows Forms程序 2.分析上面的程序 3.Mediator pattern(中介者模式) 4.卡UI怎么办——BackgroundWorker组件 用VS创建一个 ...

  2. 用VIM写作

    Write in VIm 1.Writing in Vim by Dr. Bunsen

  3. Codevs 2611 观光旅游(floyed最小环)

    2611 观光旅游 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 钻石 Diamond 题目描述 Description 某旅游区里面有N个景点.两个景点之间可能直接有道路相连,用 ...

  4. 小shell函数

     whoport() {  port=$1  echo "------ who occupied port: $port ----------"  info=$(sudo lsof ...

  5. Asp.net自带导出方法

    ///datatable数据源 filename绝对路径 如:E:\\***.xls DataTable.WriteXml(fileName)

  6. JavaScript事件总结

    JavaScript 事件总结   本文总结自<JavaScript高级程序设计>以及自己平时的经验,针对较新浏览器以及 DOM3 级事件标准(2016年8月),对少部分内容作了更正,增加 ...

  7. Javascript 计算分页

    var getPageData = function (last_page, current_page) { var numberLinks = []; var i = 0; for (i; i &l ...

  8. can't add foreign key in mysql?

    create table department (dept_name ), building ), budget numeric(,) ), primary key (dept_name) ); cr ...

  9. AngularJS的使用方法

    1.第一个ng demo <div ng-app="" ng-init="name='Kevin'"> <input ng-model=&qu ...

  10. 关于Windows环境下安装Android模拟器Genymotion的教程

    打开Genymotion的官网www.genymotion.com,点击按钮"get genymotion", 选择"Free"下的"DOWNLOAD ...