为身体和html设置高度为100％的目的

Question

<style> 
html, body { 
    height: 100%; 
} 

img.one { 
    height: auto; 
    width: auto; 
} 

img.two { 
    height: 50%; 
    width: 50%; 
} 
</style> 

在上面的CSS中，当我拿出身体和html的高度属性时，似乎发生了某些事情，但我不明白是什么。 为body和html设置高度为100％的目的是什么？

Answer 1

如果您从html, body移除高度，则img.two { height: 50%; }不再具有参考高度。那么应该是50％呢？

Answer 2

添加边框以查看差异。

html, body { 
    height: 100%; /* Ex: Change it 100% to %75 */ 
    border: 2px solid red; 
} 

当您完成后，您可以删除该行。