高度百分比在CSS中不工作 [英] Height percentage not working in CSS

问题描述

我试图使用height属性使用百分比，但它不工作。我想使用百分比，所以它看起来很好在任何分辨率。

I am trying to use height property using percentages, but it doesn't work. I want to use percentage so it looks fine in any resolution.

<div id="bloque_1" style="height: 80%;background: red">   
</div>

如何让它工作？

推荐答案

当你对宽度或高度使用％时，你应该问的第一个问题是 80 ％什么？所以你还需要对父元素应用height，所以假设你的这个元素在body标签中，你需要在你的CSS中使用它。

When you are using % for width, or height, the 1st question you should ask is that 80% of what? So you also need to apply height to the parent element, so assuming that this element of yours is inside the body tag, you need to use this in your CSS

html, body {
   height: 100%;
}

现在您的 div 元素 100％

演示

注意：正在处理 absolute 定位的元素，您可能会遇到一个情况，其中您的 div 不会超过当前的视口高度，因此在这种情况下，您需要具有 min-height

Side Note: Also when you are dealing with absolute positioned elements, you may come across a scenario where your div won't exceed the current viewport height, so in that case you need to have min-height

这篇关于高度百分比在CSS中不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！