CSS calc继承

我想使用继承与calc()像这样：

#foo{
  animation-duration:10s;
}
#foo > .bar
{
  animation-duration:calc(inherit + 2s); /* =12s */
}

但它似乎不起作用.

是浏览器的错误还是规格？

解决方法

inherit关键字只能作为属性声明中的值单独存在.它不能与其他任何东西一起使用,因为它本身就是一个价值.这意味着它不能与calc()等函数一起使用.见 CSS2.1和 css3-cascade.

此外,calc()函数本身也是only takes literal numeric values such as numbers,dimensions and percentages.

所以简单来说,规范不允许这样使用继承.