未定义变量时计算css高度[重复]

Posted 2023-03-06

【中文标题】未定义变量时计算css高度[重复]

【英文标题】：Calculate css height when variable is not defined [duplicate]

【发布时间】：2022-01-22 03:19:10

【问题描述】：

我正在尝试将 div 的高度设置为全屏高度减去其他变量的高度，例如页面横幅和页面通知。然而，页面通知并不总是出现在某些页面中，因此高度计算不适用于没有页面通知的页面。

我如何告诉 CSS 计算高度的值，如果变量 page-notification-height 未定义，那么忽略它或将值设置为 0？

.div 
  height: calc(100vh - var(page-banner-height) - var(page-notificaton-height));

【参考方案1】：

你不能告诉 css 不计算这个，css 很聪明，但它也很笨。

你可以做的一件事就是欺骗它，这取决于你如何设置变量，你应该能够在 :root 选择器上设置一个默认值。在那里，您可以将两个 car 都设置为 0，这样当这两个元素都不存在时，小牛将是 100%。