如何在伪类之前使用！important覆盖样式

Question

这就是这种情况。我正在尝试禁用所有动画。所以我把这个类放到了身体的

class collection:
.no-transition * {
-webkit-transition: none !important;
-moz-transition: none !important;
-ms-transition: none !important;
-o-transition: none !important;
transition: none !important;
}

It works for the most part, except for the toggle button that implements animation using:

.slider:before {
position: absolute;
content: '';
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: 0.4s;
transition: 0.4s;
}

.no-transition似乎不覆盖.slider：before 所有帮助将不胜感激。谢谢

Answer 1

好吧，这取决于您的:before和.no-transition对齐的位置，但是类似的东西应该涵盖这些方面：

.no-transition *, .no-transition:before, .no-transition *:before {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
}