CSS是一种用于网页排版和样式设计的语言，可以控制网页中各种元素的样式、大小、位置、颜色等等。在CSS中，我们常常需要根据父容器的高度来控制子元素的样式，下面介绍两种常见的方法。

.method1 {
height: calc(100% - 50px);
}

方法1：使用calc函数

calc函数可计算表达式，并返回结果。通常我们会用它来计算子元素的高度，如下所示：

.parent {
height: 500px;
position: relative;
}
.child {
height: calc(100% - 50px);
position: absolute;
bottom: 0;
left: 0;
}

在这个例子中，.parent元素的高度为500像素，.child元素的高度自然就等于父容器高度减去50px。

需要注意的是，calc函数的表达式中各项操作符两侧必须有空格，否则会导致错误。例如，calc(100%/2)是合法的，但calc(100%/-2)则是错误的。

.method2 {
height: 100%;
display: flex;
flex-direction: column;
}
.method2-child {
flex: 1 0 auto;
}

方法2：使用flexbox布局

flexbox布局可以帮助我们轻松地实现各种复杂的布局需求。在这个例子中，我们可以将父容器的display属性设置为flex，然后再设置flex-direction为column，这将使得子元素垂直排列。

接着，我们将子元素的flex属性设置为“1 0 auto”，这将使得子元素在垂直方向上充满整个父容器。

综上所述，我们可以根据具体情况选择不同的方法来判断父容器的高度，以达到更好的样式效果。