html - 禁用单一样式的 CSS 过渡？

Question

为单个样式启用 CSS 过渡非常容易，但是否可以为单个样式禁用它们？

单一样式转换的常用方法是：

div
{
    transition: opacity 0.5s;
}

但我想做的是设置一个全局转换，然后为单个属性禁用它。也许是这样的？

div
{
    transition: 0.5s opacity 0s;
}

这有可能吗？

编辑 我不想禁用一个元素的所有转换，我想禁用一个元素的一个转换。即我希望所有属性都转换不透明度除外。

这是一个要演示的小提琴：http: //jsfiddle.net/jakelauer/QSJXV/

Answer 1

您似乎可以通过为该属性设置一个非常短的过渡持续时间来模拟所需的行为（参见小提琴）：

transition: all 3s ease, background-color .01s linear;

Answer 2

我解决了这个问题。这里的例子：http: //jsfiddle.net/jakelauer/QSJXV/1/

它完全按照我的想法工作，除了我缺少一个逗号。正确的代码示例：

transition: 0.5s, opacity 0s;
-webkit-transition: 0.5s, opacity 0s;

Answer 3

您可以使用 :not 伪选择器来排除那些用不应具有转换的类标记的元素。

div {
  opacity: 1.0;
  ...
  -webkit-transition: all 0.5s;
     -moz-transition: all 0.5s;
          transition: all 0.5s;
}

// Change state for example
div:hover:not(.disable-transition) {
  opacity: 0.5;
}

.disable-transition {
   // Manually maintain the opacity so there is no change
   opacity: 1.0;
}