码迷,mamicode.com
首页 > 其他好文 > 详细

给body设置高度

时间:2019-02-28 11:49:12      阅读:162      评论:0      收藏:0      [点我收藏+]

标签:继承   有趣   背景色   背景   一个   比较   自己的   页面   strong   


今天做一个小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设置高度

标签:继承   有趣   背景色   背景   一个   比较   自己的   页面   strong   

原文地址:https://www.cnblogs.com/MelodysBlog/p/10449326.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!