The transition-property
property defines
what property, or properties to apply a transition effect.
This is done by providing the name of the property as the value:
.example { transition-property: color; }
transition-property: none|all|property;
transition-property |
Yes | 10.0 | Yes | Yes | Yes |
<!DOCTYPE html>
<html>
<head>
<style>
div {<!--from w w w. j a v a 2 s .c om-->
width: 100px;
height: 100px;
background: red;
-webkit-transition-property: width; /* Safari */
-webkit-transition-duration: 2s; /* Safari */
transition-property: width;
transition-duration: 2s;
}
div:hover {
width: 300px;
}
</style>
</head>
<body>
<div></div>
<p>Hover over the div element above, to see the transition effect.</p>
</body>
</html>