在CSS3中，是否可以让一个类只向现有的转换添加新的转换属性，而不是替换旧的转换定义？
例如：
.transition-a {
transition: opacity 0.3s ease-in;
}
.transition-b {
transition: color 0.3s ease-in !important;
}<div class="transition-a transition-b">
</div>将覆盖转场-A，而不是向现有转场定义添加附加属性。
如果可以组合不同的类（如mixin），从而生成类似于
transition: color 0.3s ease-in, opacity 0.3 ease-in`而不需要显式地指定用于两个类的组合的规则，这将迫使您重复自己的操作。
- 编辑**：更多详细信息
我目前使用Bootstrap的SASS源代码，并希望在Bootstrap .badge类上应用额外的转换。我有一个额外的类.fade，包含以下内容：
.custom-badge.fade {
transition: opacity 0.3s ease-in !important;如果它不覆盖Bootstrap .badge类过渡属性的定义，它会工作得很好。我只是想添加一个额外的过渡属性到现有的颜色过渡。
2条答案
按热度按时间wwwo4jvm1#
这是不可能的。
但是，在这种情况下，我的解决方法是分解短语法，只重写需要更改的属性，这样就可以保留其余的属性。
在这种情况下：
注意：如果. transition-b在. transition-a之后声明，则可以省略! important NB2：这对于背景图像效果很好。
k4ymrczo2#
如果转场具有相同的持续时间、延迟和缓动，则始终可以使用
transition-property: all：表面上看，使用
all会对性能造成影响（例如，请参见this answer），但我从未注意到这一点。