关于html：使div固定高度百分比


Make div fixed height by percent

本问题已经有最佳答案，请猛点这里访问。

我正在创建一个具有100%父级宽度的DIV，现在我希望它是父级高度的10%(不考虑内容的长度)。

我设置了height: 10%，但它仍然没有解决我的问题。

这是我的CSS：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
body {
    margin: 0px;
    padding: 0px;
    height: 100%;
}

.header {
    display: inline-block;
    background-color: #008CDA;
    width: 100%;
    height: 10%;
    margin: 0px auto;
    padding: 0px;
}
相关讨论

他的父母都必须身高：100%。

通常是这样的：

1
2
3
4
5
6
7
8
9
10
11
12
13
html,
body {
  height: 100%;
  background-color:grey;
}
.wrap {
  height: 100%;
  background-color:yellow;
}
.your_div {
  height: 10%;
  background-color:red;
}

号

1
 

相关讨论

下面是一个快速的JSfiddle，显示了您描述的父子布局：https://jsfiddle.net/k0jur7yfy/

1
2
3
4
5
{.child {
  height:10%;
  width:100%;
  background-color: red;
}

如果这不能解决您的问题，您能给我们看一段代码吗？

相关讨论

在DIV中，如果使用宽度和高度样式百分比，则它将根据内容进行调整，但在PX中使用样式时，它将根据宽度和高度的大小进行调整。例子：

1
FOr example

。

选中它，首先生成一个DIV及其类父级。在此处输入图像描述在CSS文件或头文件中添加了以下类。.父级高度：10%；宽度：100%；