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. C#中使用UDP通信

    UDP通信是无连接通信,客户端在发送数据前无需与服务器端建立连接,即使服务器端不在线也可以发送,但是不能保证服务器端可以收到数据. 服务器端代码: static void Main(string[]  ...

  2. C# 利用范型与扩展方法重构代码

    在一些C#代码中常常可以看到 //An Simple Example By Ray Linn class CarCollection :ICollection { IList list; public ...

  3. Ogre分层渲染 (转)

    Ogre分层渲染 转载请注明出处!http://www.cnblogs.com/pulas 在超大的场景中,如果既想看到近处的物体,又想看到很远的物体,则必须把相机的远近裁剪面距离设得很大.远近裁剪面 ...

  4. delphi 数组类型

    数组类型 数组类型定义了一组指定类型的元素序列,在方括号中填入下标值就可访问数组中的元素.定义数组时,方括号也用来指定可能的下标值.例如,下面的代码中定义了一个有 24 个整数的数组:type     ...

  5. ListView 文件重命名

          unit Unit1; interface uses   Windows, Messages, SysUtils, Variants, Classes, Graphics, Control ...

  6. [Javascript] IO Functor

    IO functor doesn't like Maybe(), Either() functors. Instead of get a value, it takes a function. API ...

  7. mybatis 关联映射传递多参数方法

    <resultMap type="com.secoo.my.bean.OrderItemComment" id="orderItemResult"> ...

  8. 【ZZ】C 语言中的指针和内存泄漏 & 编写高效的C程序与C代码优化

    C 语言中的指针和内存泄漏 http://www.ibm.com/developerworks/cn/aix/library/au-toughgame/ 本文讨论了几种在使用动态内存分配时可以避免的陷 ...

  9. [转]网站优化-IIS7下静态文件的优化

    本文转自:http://www.cnblogs.com/Leung/archive/2009/10/26/1590256.html 在网站开发过程中,通常我们会对网站的静态文件做处事,像图片文件,CS ...

  10. [改善Java代码]不要在构造函数中抛出异常

    Java的异常机制有三种: 一.Error类以及其子类表示的是错误,它是不需要程序员处理也不能处理的异常.比如VirtualMachineError虚拟机错误,ThreadDeath线程僵尸等. 二. ...