如何在 calc() 中使用 var()？ [复制]

Question

我正在尝试以下方法，以便将标题的高度从其下方的元素中减去。

header {
  height: var(--header-height);

  --header-height: 150px;
}

main {
  height: calc(100% - var(--header-height));
}

我做错了什么？

为什么不计算 calc() 中的“150px”值？

Answer 1

我把变量的声明移到了这里：

:root {
  --header-height: 200px;
}

现在可以了！