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. 将PHP作为Shell脚本语言使用

    我们都知道.PHP是一种非常好的动态网页开发语言(速度飞快.开发周期短--).可是仅仅有非常少数的人意识到PHP也能够非常好的作为编写Shell脚本的语言,当PHP作为编写Shell脚本的语言时,他并 ...

  2. Linux - 打印文件夹全部文件 代码(C)

    列出文件夹全部文件 代码(C) 本文地址:http://blog.csdn.net/caroline_wendy 首先配置环境,參考:http://blog.csdn.net/caroline_wen ...

  3. makefile中的patsubst

    函数名称:加前缀函数—addprefix. 函数功能:为“NAMES…”中的每个文件名称加入前缀“PREFIX”.參数“NAMES…”是空格切割的文件名称序列,将“SUFFIX”加入到此序列的每个文件 ...

  4. 归并排序的C语言实现

    归并排序的核心思想是 Divide-and-Conquer 算法,即将要解决的size为n的问题,分成a个size为n/b的子问题,这些子问题的结果经过O(n^d)的时间复杂度合并,即可解决最初的问题 ...

  5. 面试题——设计一个程序：运行报错Stack Overflow Error

    所谓Stack Overflow就是栈里面放的东西太多了,溢出了. 大家知道栈里面存放的是基本数据类型还有引用类型. 下面看这个程序 class Test { public static void m ...

  6. jQuery訪问属性，绝对定位

    一. jQuery訪问属性 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  7. .Net中JS调用后台的方法

    前台方法: <script type="text/jscript"> var k = "test"; var s = '<%=ShowMsg( ...

  8. 琐碎-关于hadoop2.2.0

    HDFS模块功能 namenode:主节点,存储文件的元数据如文件名.文件目录结构.文件属性(生成时间.副本数.文件权限).以及每个文件的块列表和块所在的datanode等: datanode:在本地 ...

  9. B - 一行盒子

    Description 你有一行盒子,从左到右依次编号为1, 2, 3,…, n.你可以执行四种指令: 1 X Y表示把盒子X移动到盒子Y左边(如果X已经在Y的左边则忽略此指令).2 X Y表示把盒子 ...

  10. 打印W图案

    一:规律 二维图形的展示都可以使用二维数组来解决,W图形x轴0,1,2,1,0,1,2.....在0到2直接来回的徘徊 y轴是在一直递增........ 二:代码 @Test /** * 测试打印w图 ...