今天做一个小demo,需要给body设置高度为100%,然鹅发现只设置body的height不可行,需,html,body{height:100%;}
为何呢?
一个容器的height是从上一级继承而来的,html{height:100%}中设置的html的高度是相对于浏览器来说,而body中的高度又从html中继承,指的是页面的高度。

在查资料时,也发现比较有趣的一点:
当html标签无背景样式时,body的背景色其实不是body标签的背景色,而是浏览器的。
一旦html标签含有背景色,则body的背景色变成了正常的body标签自己的背景色,而此时的html标签最顶级,背景色被浏览器获取,成为浏览器的背景色。
简单的说就是,html优先于body标签,浏览器按html>body的顺序提取其设置的背景样式作为浏览器的背景,也就是用户能看到的背景。

给body设置高度的更多相关文章

  1. 如何给span设置高度宽度?

    内容提要:给Span设置高度和宽度后没有作用.本文介绍了如何如何给span设置高度宽度. CSS模型中经常用的容器是DIV和span. 给Span设置高度和宽度后没有作用. <style typ ...

  2. div+css总结—FF下div不设置高度背景颜色或外边框不能正常显示的解决方法(借鉴)

    原地址:http://blog.sina.com.cn/s/blog_60b35e830100qwr2.html 在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度, ...

  3. 对Iframe和图表设置高度的优质代码

    //对Iframe和图表设置高度 function f() { parent.window.setWinHeight(parent.window.document.getElementById(&qu ...

  4. Chrome&FF&Opera&下DIV不设置高度显示背景颜色和边框的办法

    今天在排版的时候,外层的div不写高度的话背景颜色和边框没法办法显示,但是在IE下面就可以,这个有三个解决办法. 第一: 直接给最外层的div设置高度(不推荐). 第二: 在内部每个div后添加一个清 ...

  5. pickView不需要明确设置高度

    pickView不用设置高度,若设置了,在iOS8.4.1上不会被填充,会造成没有把pickView高度设置成你想要的,但是布局其他地方的时候却会从你设置的地方开始,就会造成布局不紧挨着或者遮盖着的效 ...

  6. HTML的TextArea标记跟随文本内容自动设置高度

    js <textarea name="textarea" id="textarea" style='overflow-y: hidden;height:2 ...

  7. 关于ckeditor5设置高度

    在管理端模板AdminBSBMaterialDesign-master里发现一个比百度编辑器看起来更高大上的编辑器:ckeditor.模板中使用的是版本4,自己在官网上下载了最新版本.在之前的版本,使 ...

  8. ueditor 设置高度height. ue.setHeight(400); 设置宽度 width

    1.引入的文件: <script type="text/javascript" src="../../dist/ueditor1_4_3-utf8-php/uedi ...

  9. 控件View动态设置高度时会卡顿、速度慢的情况解决

    今天碰到这种情况,一直想不通是什么问题,之前一直设置高度的时候也不卡为何今天就这么卡了.做了很多小示例一直是很慢,后来试着把View的上级节点RelativeLayout的替换成了LinearLayo ...

  10. select设置高度的兼容问题

    在IE678下,我们给select设置高度的话,里面的option无法居中,折中的兼容方式就是,我们给select的border:0:外面套一层div,这个div给他设置padding,让select ...

随机推荐

  1. 池化层的back proporgation 原理

    转载:https://www.jianshu.com/p/6928203bf75b

  2. Elasticsearch核心技术(1)--- Docker容器中运行ES、Kibana、Cerebro

    Docker容器中运行ES,Kibana,Cerebro和Logstash安装与数据导入ES 想加强ES有关的知识,看了阮一鸣老师讲的<Elasticsearch核心技术与实战>收获很大, ...

  3. Leetcode之二分法专题-162. 寻找峰值(Find Peak Element)

    Leetcode之二分法专题-162. 寻找峰值(Find Peak Element) 峰值元素是指其值大于左右相邻值的元素. 给定一个输入数组 nums,其中 nums[i] ≠ nums[i+1] ...

  4. ubuntu 用户无法/循环登陆的问题

    安装oracle数据库的时候需要新建用户oracle,使用的命令为:useradd oracle.这样做直接创建了用户oracle,但并没有在home目录下创建oracle用户的文件.在log out ...

  5. softRestTemplate 2

    @SuppressWarnings("unchecked")    public User getUser(String id,String name) {        Soft ...

  6. 安装python的第三方库pillow

    参考:http://jingyan.baidu.com/article/ff42efa929e6c8c19f220254.html 用Python做图像处理时,需要用到PIL(图像处理库).但是PIL ...

  7. hdu 1182 A Bug's Life(简单种类并查集)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1829 题意:就是给你m条关系a与b有性关系,问这些关系中是否有同性恋 这是一道简单的种类并查集,而且也 ...

  8. CF988D Points and Powers of Two 数学结论题 规律 第十题

    Points and Powers of Two time limit per test 4 seconds memory limit per test 256 megabytes input sta ...

  9. Java Web第一个应用搭建

    导语:搭建一个JAVA WEB,首先你要安装好java,如果不知道怎么安装Java的同学,可以自行百度,这里不做讲解.安装好java之后,我们还需要安装一个本地服务器,这里我们用到的是Tomcat.接 ...

  10. 2、pytest中文文档--使用和调用

    目录 使用和调用 通过python -m pytest调用pytest *pytest执行结束时返回的状态码 pytest命令执行结束,可能会返回以下六种状态码: *获取帮助信息 最多允许失败的测试用 ...