css transition many properties code example

Example 1: css transition all

-webkit-transition: all .3s ease-in-out;
-moz-transition:    all .3s ease-in-out;
-o-transition:      all .3s ease-in-out;
-ms-transition:     all .3s ease-in-out;
transition:         all .3s ease-in-out;

Example 2: css transition select multiple attributes

.myclass {
  	/* ... */
    transition: all 200ms ease;
    transition-property: box-shadow, height, width, background, font-size;
}

Example 3: multiple transition in css

.nav a {
  transition: color .2s, text-shadow .2s;
}

Example 4: transition multiple properties

.class-name {
  /* element transitions top and font-size for two seconds */
  transition: height 2s ease-in-out, font-size 2s ease-in-out;
}

Tags:

Css Example