之前网课案例总是不屑于去看，因为总觉得太花时间，但是不可否认的是，认真去看还是会有收获的，而且常有意外收获

昨天在看实现动画效果的综合案例中，意外解决了我长久以来的一个疑问：为什么给元素设置height:100%不生效？

样式不生效原因

给元素设置height:100%，元素的高度会变成父元素的100%

如果元素高度未生效，很有可能父元素的高度是0，导致子元素的高度也是0

案例

例如，在一个html骨架中，我给body添加了height:100%，但是打开浏览器审查元素时发现，body的高度居然是0

而body的父元素是html，审查元素发现，html的高度也是0

解决方案

超级easy，将html的高度也设为100%就好啦

html {
    height: 100%;
}

再次打开浏览器，body的高度就生效啦