禁用/关闭继承的CSS3过渡

所以我有以下css过渡附加到a元素：

a { 
     -webkit-transition:color 0.1s ease-in, background-color 0.1s ease-in ;  
     -moz-transition:color 0.1s ease-in, background-color 0.1s ease-in;  
     -o-transition:color 0.1s ease-in, background-color 0.1s ease-in;  
     transition:color 0.1s ease-in, background-color 0.1s ease-in; 
}

有没有办法禁用特定元素上的这些继承的过渡？

a.tags { transition: none; } 

似乎没有完成这项工作。

transition: none鉴于以下HTML ，似乎支持使用（对Opera进行了特定调整）：

<a href="#" class="transition">Content</a>
<a href="#" class="transition">Content</a>
<a href="#" class="noTransition">Content</a>
<a href="#" class="transition">Content</a>

...和CSS：

a {
    color: #f90;
    -webkit-transition:color 0.8s ease-in, background-color 0.1s ease-in ;  
    -moz-transition:color 0.8s ease-in, background-color 0.1s ease-in;  
    -o-transition:color 0.8s ease-in, background-color 0.1s ease-in;  
    transition:color 0.8s ease-in, background-color 0.1s ease-in; 
}
a:hover {
    color: #f00;
    -webkit-transition:color 0.8s ease-in, background-color 0.1s ease-in ;  
    -moz-transition:color 0.8s ease-in, background-color 0.1s ease-in;  
    -o-transition:color 0.8s ease-in, background-color 0.1s ease-in;  
    transition:color 0.8s ease-in, background-color 0.1s ease-in; 
}
a.noTransition {
    -moz-transition: none;
    -webkit-transition: none;
    -o-transition: color 0 ease-in;
    transition: none;
}

JS小提琴演示。

已在Ubuntu 11.04上使用Chromium 12，Opera 11.x和Firefox 5进行了测试。

对Opera的特定修改是使用，-o-transition: color 0 ease-in;它的目标与其他transition规则中指定的属性相同，但是将过渡时间设置为0，这有效地防止了过渡的出现。a.noTransition选择器的使用仅是为元素提供特定的选择器，而无需进行过渡。

编辑注意，@FrédéricHamidi的answerall（至少对于Opera而言）使用比列出不想转换的每个单独的属性名称更为简洁。

all-o-transition: all 0 none自删除@Frédéric的答案后，更新了JS Fiddle演示，展示了在Opera：中的用法。

如果要禁用单个过渡属性，可以执行以下操作：

transition: color 0s;

（因为零秒转换与无转换相同。）

删除所有过渡的另一种方法是使用unset关键字：

a.tags {
    transition: unset;
}

在的情况下transition，unset等效于initial，因为transition它不是继承的属性：

a.tags {
    transition: initial;
}

一位了解unset并initial能立即判断出这些解决方案正确的读者，而无需考虑的特定语法transition。

您也可以取消继承包含元素内的所有转换：

CSS：

.noTrans *{
-moz-transition: none;
-webkit-transition: none;
-o-transition: color 0 ease-in;
transition: none;
}

HTML：

<a href="#">Content</a>
<a href="#">Content</a>
<div class="noTrans">
<a href="#">Content</a>
</div>
<a href="#">Content</a>

基于W3schools，默认过渡值是：all 0s ease 0s，这应该是跨浏览器兼容的禁用过渡的方式。

这是一个链接：https : //www.w3schools.com/cssref/css3_pr_transition.asp