Definir propiedad de transición múltiple en CSS

Question

Al configurar transition-property en all, se ve mal al hacer zoom dentro de la ventana del navegador, porque las propiedades width y height también se están realizando la transición. Cuando sólo quiero background y color, tengo que definirlo de múltiples líneas, sin embargo:

transition-property: color, background; 
transition-duration: 250ms; 

Esto es malo, porque yo también tengo que hacerlo por -webkit-, -moz y -o-. En cambio, estoy buscando algo como esto:

transition: [color and background] 250ms; 

¿Hay alguna sintaxis para esto?

Answer 1

Cuando se utiliza la forma abreviada transition con múltiples transiciones, es necesario repetir la duración de la transición para cada propiedad, y separar cada grupo de valores con comas:

transition: color 250ms, background 250ms; 

Con prefijos, que se parece a esto:

-moz-transition: color 250ms, background 250ms; 
-o-transition: color 250ms, background 250ms; 
-webkit-transition: color 250ms, background 250ms; 
transition: color 250ms, background 250ms; 

Todavía un poco repetitivo, pero al menos es mejor repetir transition-property y transition-duration para todos los prefijos.

La sintaxis abreviada se describe en el spec.