css-高度100%不起作用

我有以下html标记：

<div id="all">
    <div id="back">
        <div id="header">test</div>
    </div>
</div>

---

但是百分之一百的高度也不起作用

要使100%高度有效，您需要确保父div也包含100%高度。所以试试这个：

html,body{
    height: 100%;
}
#header{
    height: 100%;
    background: red;
}
#all,#back{
    height: 100%;
}

---

你需要所有

#header

的父母都有

高度：100%

，这样才能工作。

试试这个

html,body{
    height: 100%;
    min-height:100%;

}
#header{
    height: 100%;
    background: red;
}
#all,#back{
    height: 100%;
}

---

高度：100%意味着它将占据父元素的全部高度。在您的场景中，父div的#all and#back没有定义它们自己的高度。因此您还需要为它们指定高度：100%

#all,#back
{
  height:100%
}

#all,#back
{
  height:100%
}