首先想到了页面是动态的  就是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. 【错误总结1：unity StartCoroutine 报 NullReferenceException 错误】

    今天在一个项目中,写了一个单例的全局类,该类的作用是使用协程加载场景.但在StartCoroutine 这一步报了NullReferenceException 的错.仔细分析和搜索之后,得到错误原因. ...

  2. html5 css练习 定位布局

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  3. sqlserver可将字符转成数字再进行sum，如果varchar类型中存放的都是数字

    sqlserver语法: select sum(cast(score as int)) as score from 表名; 注意:int是整型,在实际操作中根据自己需要的类型转换.

  4. yum仓库源搭建

    本地yum源搭建 cd源 mount /dev/sr0 /mnt vim  /etc/yum.repos.d/base.repo [centos-base]name=centos7#baseurl=f ...

  5. linux查看与修改交换内存配置（解决zabbix-agent启动报错）

    问题 zabbix-agent在一台centos6.5上启动报错: cannot allocate shared memory of size 949056: [28] No space left o ...

  6. dnsmasq 设置自动获取主机名

    A1_IP:192.168.164.145 A1# yum install dnsmasq -y A1# echo "addn-hosts=/etc/domains" >&g ...

  7. {408} client block at 0x005D4D10, subtype 0, 64 bytes long.a CButton object at $005D4D10, 64 bytes long

    现象:mfc动态生成了很多控件,new的,退出时也delet了,但是还是出现了标题的错误 解决:在任何可以执行的地方加代码: CMFCVisualManager ::SetDefaultManager ...

  8. style1

    <!doctype html> 我的简历 基本信息 姓名 张三 性别 男 应聘职位 WEb前端工程师 联系方式 手机 12312341234 Email joinefe@baidu.com ...

  9. Java基础学习-标识符

    1.标识符的作用     -给包.类.方法.变量等起名字 2.组成规则     -这里的字符采用的是Unicode字符集,所以包括英文大小写字母,中文字符,数字字符等.不建议使用汉字.     -下划 ...

  10. Python3 tkinter基础 Scale orient 横竖 resolution单步步长 length 长度 tickinterval 指示刻度

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...