我们知道，对于块级元素浏览器总是默认使其宽度等于父容器宽度的100%不需要自己设定，但是对宽度的计算就并非这样了，当没有显式得定义容器的高度时，其高度由其包裹的内容决定，当显示得定义高度时，容器的高度就为设定的值，使用overflow可以对超出高度的内容进行处理。
有时我们不明确高度，需要使用height:100%来设定高度时，有时并不能达到预期的效果，主要原因就是当我们使用height:100%时，浏览器会去寻找其父容器的高度来确定这个height:100%具体应该是什么值，当我们没有为父容器
显式
得定义高度时，浏览器就无法获取相应的值，所以不能达到预期的效果，
所以，使height:100%生效的根本解决办法就是父级一定要有
显式
定义的高度
大家有可能主要到那两个红红的
显式
，为什么要说显式呢，因为大家常用到的还有一个与Heigh相关的属性：min-height，用来控制元素的最小高度，当我们在父元素使用Min-height来定义最小高度时，子元素使用height:100%也是无法获取高度的，详见如下例子
<div style="min-height: 500px">
<div style="height: 100%;background-color: #000"></div>
</body>
我们可以清除得看见，父元素的高度确实变成了500px，但是子元素并没有获取相应的高度，但如果为父元素添加一个显式的hegiht，如height:2px;这时，子元素就能够正确获取高度（注意，父元素不能使用height:100%,因为同上所讲，其父元素body是没有高度的，所以同样获取不到高度，除非将body.html都加上height:100%，其中html的height:100%获取的是浏览器可视区域的高度）。
查阅了w3cCSS手册，也并没有发现对此的解释，个人认为是应为height默认取值auto，根据子元素来撑起其高度，但是在这种情况下，子元素又依赖于父元素的高度，所以取值为0。若对此各位有更好的见解，欢迎在下方评论提出。
我们知道，对于块级元素浏览器总是默认使其宽度等于父容器宽度的100%不需要自己设定，但是对宽度的计算就并非这样了，当没有显式得定义容器的高度时，其高度由其包裹的内容决定，当显示得定义高度时，容器的高度就为设定的值，使用overflow可以对超出高度的内容进行处理。 有时我们不明确高度，需要使用height:100%来设定高度时，有时并不能达到预期的效果，主要原因就是当我们使用h
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx
inherit确实是个好东西，不仅节约代码，尤其与background之流打交道；而且还利于维护。
注意，如果想要继承background的图片，不能这样缩写，会显得很天真：
CSS Code复制内容到剪贴板
background: #fff inherit left top;
可以这样子：
CSS Code复制内容到剪贴板
background-image: inherit;
1. 兼容性差异
height
:
100
% IE6+ √
height
:inherit IE8+ √
2. 大多数情况作用是一样的除去兼容性，大多数情况下，两者作用是一样的，甚至都很难想出不一样的理由
当一个元素的 ‘
overflow
-x’ 或 ‘
overflow
-y’ 指定值为 ‘hidden’，另一个特性的指定值为 ‘visible’ 时， 该元素最终渲染使用的 ‘
overflow
-y’ 或 ‘
overflow
-x’ 值不同。IE6 IE7 IE8 使用 ‘hidden’，其它浏览器使用 ‘auto’。
对于 ‘
overflow
-x’ 和 ‘
overflow
-y’ 的组合渲染，所有...
原因：我们知道在把盒子宽度自适应为浏览器窗口宽度，只需设置width:
100
%就可轻松解决问题，但是让盒子的高度自适应浏览窗口的高度并非那么容易，这是因为css内部计算的原因
<!-- 高度实际为字体大小 -->
<div class="box" style="width:
100
%;
height
:
100
%;background-color:red;">
width:
100
%;
height
:
100
%;
解决方法一：设置父元素高度
html,
相信在平时写CSS的时候大家都或多或少遇见过设置了
height
为百分比的时候发现不起作用。今天我们就来一探究竟
原因：父元素未设置具体高度，子元素设置
height
:
100
%是
无效
的。
现象以及方案
[1] 设置高度为
100
%时，无法实现全屏
<!DOCTYPE html>
<html lang="en">
<meta ...
css属性中的
overflow
如果要生效必须满足一个条件：子元素必须大于父元素
为什么html禁止了
overflow
子元素中添加了
overflow
但是并不生效。这是有可能由于父元素与子元素同为
100
%，父元素是与子元素一起变化不存在子元素
overflow
父元素的情况。
根据实验得到可以通过在父元素添加
height
属性，并设置为一个很小的值，或者设置
overflow
为hidden限制父元素的大小...
height
:
100
%
无效
意思是指这个 CSS 属性不起作用。这通常是因为它所在的元素没有继承到合适的高度，或者它所在的元素的父元素没有设置合适的高度。你需要给这个元素的父元素设置一个合适的高度，然后再尝试使用
height
:
100
% 来设置这个元素的高度。
例如，如果你想让一个 div 元素的高度自动调整为它父元素的高度，你可以这样写：
```css
.parent {
height
: 500px;
.child {
height
:
100
%;
这样，.child 元素的高度就会自动调整为 500px。
