根据当前值动态更改css样式

Question

我想知道，如果有办法根据当前的css值更改css值。

例如，如果我想将值从100更改为90，我必须这样做：

.test{
    margin-top:100px;
}
.test:hover{
    margin-top:90px;
}

但是可以做这样的事情并产生同样的效果吗？

.test{
    margin-top:100px;
}
.test:hover{
    margin-top:(-10px);
}

在此先感谢，我希望我的问题非常明确。

BTW：我不是在寻找一个JavaScript解决方案，因为我已经知道如何做到这一点，我只是想知道是否只有CSS才有可能

Answer 1

目前，不，您不能使用CSS 单独 来执行此操作，因为它不是动态语言。

支持/释放CSS variables时，我想你可以做类似的事情。

这是一个给出的例子：

  

2.3 Resolving Dependency Cycles - 示例8

<one><two><three /></two></one>
one   { var-foo: 10px; }
two   { var-bar: calc(var(foo) + 10px); }
three { var-foo: calc(var(bar) + 10px); }

与此同时，我建议您查看LESS或SASS。