css – 将转换添加到其他属性

我有一个包含两个类的元素：

<div class="class1 class2"></div>

.class1 {transition: background-color 0.4s;}
.class2 {transition: top 1s;}

问题是class2的转换会覆盖class1的转换.

我不能使用.class2 {transition：all 1s}因为转换持续时间必须不同.

我也不想将类从class1复制到class2,因为class2也可以应用于其他元素.

有没有办法在不覆盖现有元素的情况下向元素添加转换？

解决方法

在CSS中,当有两个冲突的属性时,最后一个将始终覆盖第一个(除非你添加“！important”,在我看来有点懒).

你想考虑重新思考CSS的流动方式.您希望元素始终具有的最重要的样式应该在第一个块中……并且后续样式应该以加法的方式应用.