基本高度百分比 [英] Basic height percentage

查看：109 发布时间：2017/1/20 23:05:18 css

本文介绍了基本高度百分比的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

我不明白高度百分比的工作原理。

为什么以下片段未填充颜色？

 body {height：100％;}＃div1 {height：20％; background-color：red;}＃div2 {height：80％; background-color：blue;}

 < div id = div1>< / div>< div id =div2>< / div>

解决方案

您必须设置 html 的。

  html，body {height：100％; margin：0;}＃div1 {height：20％; background-color：red;}＃div2 {height：80％; background-color：blue;}

 < div id = div1>< / div>< div id =div2>< / div>

I don't understand how height percentages work.

Why is the following snippet not filled with color?

body {
  height: 100%;
}
#div1 {
  height: 20%;
  background-color: red;
}
#div2 {
  height: 80%;
  background-color: blue;
}

<div id="div1"></div>
<div id="div2"></div>

解决方案

You have to set the html's height as well.

html,
body {
  height: 100%;
  margin: 0;
}
#div1 {
  height: 20%;
  background-color: red;
}
#div2 {
  height: 80%;
  background-color: blue;
}

<div id="div1"></div>
<div id="div2"></div>

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

查看全文