Desactivar / desactivar las transiciones CSS3 heredadas

Entonces tengo las siguientes transiciones CSS adjuntas al elemento 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; 
}

¿Hay alguna forma de deshabilitar estas transiciones heredadas en elementos específicos a?

a.tags { transition: none; } 

No parece estar haciendo el trabajo.

El uso de transition: noneparece ser compatible (con un ajuste específico para Opera) dado el siguiente HTML:

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

... y 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;
}

Demostración de JS Fiddle .

Probado con Chromium 12, Opera 11.xy Firefox 5 en Ubuntu 11.04.

La adaptación específica a Opera es el uso de -o-transition: color 0 ease-in;que apunta a la misma propiedad que se especifica en las otras transitionreglas, pero establece el tiempo de transición en 0, lo que efectivamente evita que la transición sea notable. El uso del a.noTransitionselector es simplemente proporcionar un selector específico para los elementos sin transiciones.

Editado para tener en cuenta que la respuesta de @ Frédéric Hamidi , usar all(para Opera, al menos) es mucho más conciso que enumerar cada nombre de propiedad individual que no desea que tenga una transición.

Se actualizó la demostración de JS Fiddle, que muestra el uso de allen Opera:,-o-transition: all 0 none luego de la eliminación automática de la respuesta de @ Frédéric .

Si desea deshabilitar una sola propiedad de transición, puede hacer lo siguiente:

transition: color 0s;

(dado que una transición de cero segundos es lo mismo que ninguna transición).

Otra forma de eliminar todas las transiciones es con la unsetpalabra clave:

a.tags {
    transition: unset;
}

En el caso de transition, unsetes equivalente a initial, ya transitionque no es una propiedad heredada:

a.tags {
    transition: initial;
}

Un lector que sepa unsety initialpueda decir que estas soluciones son correctas de inmediato, sin tener que pensar en la sintaxis específica de transition.

También puede desheredar todas las transiciones dentro de un elemento contenedor:

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>

Basado en el valor de transición predeterminado de W3schools es:, all 0s ease 0sque debería ser la forma compatible con todos los navegadores de deshabilitar la transición.

Aquí hay un enlace: https://www.w3schools.com/cssref/css3_pr_transition.asp