css中calc属性不起作用
1、格式错误
calc属性作用不起作用是因为书写格式错误，正确的格式需要在运算符的两边留有空格。
{
height: calc(100vh-20px); // 不生效！需要空格
height: calc(100vh - 20px); // 正确写法
}
2、父元素需要设置高度或者宽度，不能用100%。文章来源：https://www.toymoban.com/news/detail-546637.html
{
height: 200px; // 父元素需要确切高度
.child{ // 子元素继承高度
height：calc(100% - 20px); // 正确写法：calc高度继承父元素200px
}
}
- scss、less函数不生效
{
$rem: 16px; // 定义变量
height: calc(100vh - $rem); // 不生效
height: calc(100vh - #($rem)); // 正确写法 #($rem)
}
如果还解决不了，请留言 。 Up高频在线文章来源地址https://www.toymoban.com/news/detail-546637.html
到了这里，关于css中calc不生效（不起作用）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
