首先想到了页面是动态的  就是js 计算

但是有一个简单的方法就是

运用定位

1 footer 的祖先元素没有定位属性 absoulite （这样他就会相对于文档定位） left:0 bottom :0 width:100%; (因为定位后脱离文档流 宽度得加)

2 html 设置min-height:100%;   因为页面设置height 就不是动态的   同时 body 和html  是不一样的 页面不足一屏时  body 高度并没有到底部   bottom 就会出现问题 并不是实际文档底部

body 单独设置100% 并不会沾满全屏 html设置100% body再设置100% body还是空因为继承必须是具体数字

当页面超出一屏时 foot 定位到bottom :0 是不管用的   解决方案 给html 设置position relitive      因为foot 定位脱离文档流 所以foot 还会挡住底部 所以body 设置margin-bottomd底部高度

body+foote高度    html 定位   footer定位

关于footer 小于一屏还要在底部显示的思考的更多相关文章

  1. div footer标签css实现位于页面底部固定

    Web页面的“footer”部分随着飘上来,处在页面的半腰中间,给视觉效果带来极大的影响,让你的页面看上去很不好看,特别是现在宽屏越来越多,这种现象更是常见,本文将介绍两种解决方案,需要了解的朋友可以 ...

  2. 关于ubuntu终端全屏的时候不能显示底部

    最近在win7的电脑上装了ubuntu,也就是双系统.打算之后工作就直接进入ubuntu,减少之前win7和虚拟机之间的切换.进入ubuntu后,发现一个奇怪的问题是,在终端全屏的时候,底部总是有几行 ...

  3. swiper4实现的拥有header和footer的全屏滚动demo/swiper fullpage footer

    用swiper4实现的拥有header和footer的全屏滚动demo, <!DOCTYPE html> <html lang="en"> <head ...

  4. dialog自适应大小、固定大小、底部显示

    创建一个从底部显示的对话框 if (dialog == null) { dialog = new Dialog(context, R.style.theme_from_bottom); View vi ...

  5. odoo在底部显示指定字段合计和汇总时显示合计

    1.odoo的tree视图底部显示合计 tree 视图,底部显示指定字段合计数 ,视图中字段定义上在sum,取自sale.view_order_tree 销售订单 tree 视图 <field ...

  6. 在div 底部显示背景图片

    下面代码实现div层背景图片在底部显示: div { background : url (/images/bg.jpg) no-repeat fixed ; background-position-y ...

  7. 页面内容不够高footer始终位于页面的最底部

    相信很多前端工程师在开发页面时会遇到这个情况:当整个页面高度不足以占满显示屏一屏,页脚不是在页面最底部,用户视觉上会有点不好看,想让页脚始终在页面最底部,我们可能会想到用: 1.min-height来 ...

  8. html中header,footer分别固定在顶部和底部

    1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>page01</title> 5 <styl ...

  9. 使用css方法使footer保持在页面的最底部

    使footer保持在页面的底部,是常见的需求,之前面试的时候也遇见了一个这样的问题,今天在这里记录下css实现的方式. 使footer保持在页面的底部,需要考虑header+content部分不够多的 ...

随机推荐

  1. MyBatis探究-----为实体类Bean取别名，配置typeAliases

    1.单个实体类设置别名 1.1 不使用alias <typeAliases> <!-- typeAlias:为某个java类型起别名 ; type:指定要起别名的类型全类名; 默认别 ...

  2. 堆叠式降噪自动编码器（SDA）

    1.1 自动编码器  自动编码器(AutoEncoder,AE)就是一种尽可能复现输入信号的神经网络,其输出向量与输入向量同维,常按照输入向量的某种形式,通过隐层学习一个数据的表示或对原始数据进行有效 ...

  3. ［转载非常好的文章］JLink+GDBServer调试S3C6410裸板的初始化代码 For OK6410开发板

    要调试裸板,有两种初始化方法,一个是用烧好的uboot初始化,再有就是直接用JLink+GDBServer初始化.代码参考了网上的资料,根据手头的OK6410开发板做了修改.整体代码如下: # Con ...

  4. liunx驱动----USB驱动

    现象:把usb设备接入电脑 1.Windows发现设备 2.跳出一个对话框提示安装驱动程序 问1:既然没有驱动程序,为什么了够知道是什么驱动了?? 答1:Windows里面已经有了usb总线驱动程序, ...

  5. Maven不能下载SNAPSHOT包但是能下载RELEASE包的解决办法

    在使用过程中,Maven默认配置是不能下载SNAPSHOT包的,这是基于一种代码稳定性进行考量得出的结论.引入SNAPSHOT包最大的问题就是,由于SNAPSHOT允许重复上传,所以引用一个这样的包开 ...

  6. vue.js国际化vue-i18n插件的使用问题，在模版文本、组件方法、jsf方法里的使用

    vue.js国际化vue-i18n插件的使用问题,在模版文本.组件方法.jsf方法里的使用 1.在文本里使用{{$t("xxx")}} <span>{{$t(" ...

  7. C# 反射 Type.GetType()

    对于外部调用的动态库应用反射时要用到Assembly.LoadFile(),然后才是获取类型.执行方法等;当用反射创建当前程序集中对象实例或执行某个类下静态方法时只需通过Type.GetType(&q ...

  8. semaphore demo !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!1

    import 'dart:async'; import 'package:semaphore/semaphore.dart'; import 'dart:io'; import 'dart:conve ...

  9. 【模板】ST表

    给定一个长度为 \(N\) 的数列,和 \(M\) 次询问,求出每一次询问的区间\([l,r]\)内数字的最大值. 说明 对于30%的数据,满足: \(1 \leq N, M \leq 10 , 1≤ ...

  10. 原创《weex面向未来的架构》

    最近一直在做weex的调研工作,整理之后给公司做了一次技术分享. 分享内容如下: 1:Weex是什么? 2:  Weex目前能做什么? 3:  Weex 如何调试 4:  剖析一下Weex原理 5: ...