calc（）函数如何在CSS中起作用？

Question

我正在尝试将calc()用于我的CSS。我创建了一个简单的小提琴，我有两个div。一个人有一个使用calc()样式的课程。但它没有任何效果。 Div的高度没有变化。

＆＃13;

＆＃13;

.cont {
  height: calc(100% - 20px);
}

＆＃13;

<div class="cont" style="background-color:blue">fsdfds</div>
<div style="background-color:red">1234</div>

＆＃13;

＆＃13;

＆＃13;

Fiddle

感谢您的帮助。

Answer 1

calc()功能正常运行。

百分比高度您需要更好地理解。

为了使百分比高度能够处理元素，父元素必须有一个已定义的高度（除非子元素是绝对定位的）。

这是一篇详细解释的帖子：

• Working with the CSS height property and percentage values

以下是像素高度的小提琴演示：http://jsfiddle.net/UF3mb/697/