html代码结构
 <body>

     <div class="wrap">

         <div class="head"></div>

         <div class="main"></div>

         <div class="foot"></div>

     </div>

 </body>
CSS代码：
 html, body { height: 100%; }

 .wrap { min-height: 100%; height: auto !important; height: 100%;position: relative; }

 .main { padding-bottom: 100px; }

 .foot { position: absolute; bottom:; width: 100%; height: 100px;}

CSS实现底部固定的更多相关文章

  1. CSS 实现底部固定

    在制作页面有这样一种现象:当一个HTML页面中含有较少的内容时,Web页面的“footer”部分随着飘上来,处在页面的半腰中间,给视觉效果带来极大的影响,让你的页面看上去很不好看,特别是现在宽屏越来越 ...

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

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

  3. CSS Sticky Footer: 完美的CSS绝对底部

    CSS的简单在于它易学,CSS的困难在于寻找更好的解决方案.在CSS的世界里,似乎没有完美这种说法.所以,现在介绍的CSS绝对底部,只是目前个人见过的方案中比较完美的吧. 先说我们为什么会使用到这个C ...

  4. 微信小程序之顶部固定和底部固定

    顶部固定 <view style="position:fixed;top:0;"> ...... </view> 底部固定 <view style=& ...

  5. 前端CSS - 相对定位,绝对定位,固定定位

    前端CSS - 相对定位,绝对定位,固定定位 1.1 相对定位 position:relative 相对定位,就是微调元素位置的.让元素相对自己原来的位置,进行位置的微调. 也就是说,如果一个盒子想进 ...

  6. 【微信小程序】view顶部固定或底部固定 + scroll-view中的元素view也可以使用position:fixed;固定选中元素位置

    1.顶端固定核心代码如下: <view class="page__hd" style="position:fixed; top:0;width: 750rpx;&q ...

  7. css设置背景固定不滚动效果的示例

    css设置背景固定不滚动效果的示例 背景固定不滚动各位看到最多的无非就是QQ空间了,我们在很多的空间都可以看到内容滚动而北京图片不滚动了,下文整理了几个关于背景固定不滚动css代码. 一.css设置背 ...

  8. css - 紧贴底部的页脚

    有的时候,由于页面长度不够,页面底部的页脚会很尴尬的跑上来,如图: 有的同学可能会想用position:fixed;bottom:0;来永远居底.但有些场景确实不适合. 这是我从YII2中找到的简单解 ...

  9. 解决fixed在苹果手机抖动问题/头部底部固定布局

    1.头部和底部固定,中间内容滚动,不涉及fixed 1)absolute与height:100% <!DOCTYPE html><html><head> <m ...

随机推荐

  1. OneThink学习笔记02----数据字典（即OneThink项目数据库里的表及其字段）

    action 字段 类型 注释 id int(11) unsigned 自增主键 name char(30) 行为唯一标识 title char(80) 行为说明 remark char(140) 行 ...

  2. c#读取excel

    Provider根据实际EXCEL的版本来设置,推荐使用ACE接口来读取.需要Access database Engine. 注意修改注册表以下两项的值为0.否则导入EXCEL当单元格内字符长度超过2 ...

  3. IOS实现动画的几种简单方法

    1.使用 NSTimer 来实现 [NSTimer scheduledTimerWithTimeInterval:0.01 target:self selector:@selector(setNeed ...

  4. Casually have a look

    1. 用红盘子吃饭能助你减肥.教授告诉我们:“红色是一种原始的危险信号,它同时也会使盘中的食物看上去不那么诱人,所以你也会吃得更少.” 2. 要减肥请关电视.教授说:“如果你需要减肥,请在吃饭时把电视 ...

  5. 【poj1984】 Navigation Nightmare

    http://poj.org/problem?id=1984 (题目链接) 题意 给出一棵树,这棵树是以平面直角坐标系为基准建立的,也就是每个节点最多只有上下左右4条边.现在动态建树,同时询问两点间的 ...

  6. 用WebBrowser采集渲染后的HTML页面

    主要用于微信的文章采集,如果用单纯的HttpClient采集,会出现页面无法渲染的情况: 经过研究发觉公众文章html页面是经过渲染之后显示的,那么思路来了,如果在dotnet的环境下,用WebBro ...

  7. CruiseControl.NET与TFS结合的配置文件

    配置如下: <cruisecontrol xmlns:cb="urn:ccnet.config.builder"> <project name="测试项 ...

  8. CameraFlash手电筒

    有时候晚上找不到电棒,电灯,咱们可以写个小程序,利用照相机的闪光灯临时顶替上代码: 1 package com.linux.cameraflash; import android.hardware.C ...

  9. android逆向学习小结--CrackMe_1

    断断续续的总算的把android开发和逆向的这两本书看完了,虽然没有java,和android开发的基础,但总体感觉起来还是比较能接收的,毕竟都是触类旁通的.当然要深入的话还需要对这门语言的细节特性和 ...

  10. Unity3d5.0 新UI之2048

    因为汽车系统没写出来所以,纠结之中,弄了弄新版本的UI. 做了个2048. 新版本的unity的UI必须以Canvas为基底来呈现,如果没有加画布的话可是显示不出来东西的哦. 而且作为UI上的所有组件 ...