body{
  height:100%;  视窗的高度

min-height:100%;文档的具体高度
}

这两个百分比的具体高度在页脚永远放在文档底部非常重要，此时用min-height:100%

具体实现

html,

body
{ position:relative; min-height:100%; }

　　

css笔记——关于 body/html 的高度百分比的更多相关文章

  1. css中height 100vh的应用场景，动态高度百分比布局，浏览器视区大小单位

    css中height 100vh的应用场景,动态高度百分比布局,浏览器视区大小单位 height:100vh 一些只能vw, vh才能完成的应用场景: 1. 场景之:元素的尺寸限制 vw vh 主要是 ...

  2. Div高度百分比

    有时候设置高度百分比,没有效果. 原因是父元素没有设置高度. 父元素可以设置高度为具体的px.或是100%等百分比. 这样子元素再能根据百分比来设置高度. <style type="t ...

  3. 让bootstrap-table支持高度百分比

    更改BootstrapTable.prototype.resetView 方法,以支持高度百分比定义,适应不同高度屏幕 BootstrapTable.prototype.resetView = fun ...

  4. HTML+CSS笔记 CSS笔记集合

    HTML+CSS笔记 表格,超链接,图片,表单 涉及内容:表格,超链接,图片,表单 HTML+CSS笔记 CSS入门 涉及内容:简介,优势,语法说明,代码注释,CSS样式位置,不同样式优先级,选择器, ...

  5. css中如何实现左边的高度随着右边改变而改变

    css中如何实现左边的高度随着右边改变而改变 html结构: <div class="main"> <div class="main_left" ...

  6. 第一百六十六节，jQuery，基础 DOM 和 CSS 操作，元素内容，元素属性，css和class，元素宽度高度、偏移、滚动条

    jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度.偏移.滚动条 学习要点: 1.DOM 简介 2.设置元素及内容 3.元素属性操作 4.元素样式操作 ...

  7. 解决css的float父div没有高度

    在做页面设计常会碰到css的float父div没有高度的情况,HTML代码设计 <div class='box'> <div class='float_left'></d ...

  8. 纯CSS实现移动端常见布局——高度和宽度挂钩的秘密

    纯CSS实现移动端常见布局--高度和宽度挂钩的秘密 不踩坑不回头.之前我在一个项目中大量使用css3的calc计算属性.写代码的时候真心不要太爽啊-可是在项目上线之后,才让我崩溃了,原因非常easy, ...

  9. CSS笔记--选择器

    CSS笔记--选择器 mate的使用 <meta charset="UTF-8"> <title>Document</title> <me ...

随机推荐

  1. mac下批量删除.svn文件

    mac下.svn是隐藏文件,而且即使我们调成可见的,一个一个删也很麻烦.今天正好同事问起来这个命令,于是想可能有些人也需要,于是还是放到博客里吧 命令比较简单,其实就是一条linux命令,打开终端,首 ...

  2. 在Flash Builder或者Eclipse统计代码行数的方法

    在Flash  Builder或者Eclipse统计代码行数的方法如下图菜单栏--搜索--搜索文件

  3. TC SRM 664 div2 A BearCheats 暴力

     BearCheats Problem Statement    Limak is an old brown bear. Because of his bad eyesight he sometime ...

  4. centosx64位寄存器

    [root@monitor ~]# uname -aLinux monitor 2.6.32-431.23.3.el6.x86_64 #1 SMP Thu Jul 31 17:20:51 UTC 20 ...

  5. [Effective C++ --029]为“异常安全”而努力是值得的

    假设有个class用来表现夹带背景图案的GUI菜单单,这个class用于多线程环境,所以它有个互斥器(mutex)作为并发控制用: class PrettyMenu{ public: ... void ...

  6. ASP.NET 去除所有HTML标记的方法

    using System.Text.RegularExpressions /// <summary> /// 去除HTML标记 /// </summary> /// <p ...

  7. B - Broken Keyboard (a.k.a. Beiju Text)

    Problem B Broken Keyboard (a.k.a. Beiju Text) You're typing a long text with a broken keyboard. Well ...

  8. Code the Tree

    Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 2292   Accepted: 878 Description A tree ...

  9. 1. Android 系统上一款开源的图表库

    1. MPAndroidChart  MPAndroidChart 是 Android 系统上一款开源的图表库.目前提供线图和饼图,支持选择.缩放和拖放. 一个可以拖动缩放的图表库,包含曲线图.直方图 ...

  10. myeclipse web 包名保留字与servlet冲突

    包名不能取modify ..........等保留字 不能有数字