Transition-property:all | none | <property>[,<property>]*
Default value: All
Value:
All: CSS properties that can be transitioned
None: CSS properties for transitions are not specified
<PROPERTY>: Specifies the CSS properties to be staged
Description: www.2cto.com
Retrieves or sets the properties of the participating transitions in an object.
The default value is: all. The default is all CSS properties that can be staged.
If you provide multiple property values, separate them with commas.
The corresponding script attribute is transitionproperty.
The HTML code is as follows:
<div class= "Content" >
The CSS code is as follows:
<style type= "Text/css" >* {margin:0; padding:0;} Body {background: #eee; Font-family:verdana, Geneva, Sans-serif; font-size:12px;} a {text-decoration:none;} H2, H3 {margin:0 0 20px; text-shadow:2px 2px #ffffff;} h2 {font-size:28px;} h3 {font-size:22px;}. content {padding:40px; width:500px; margin:30px Auto;}. Nav {list-style:none;}. Nav li {float:left;}. Nav a {position:relative; Display:block; PADDING:4PX 8px; border-bottom:2px solid #ccc; Background: #f4f4f4; Color: #999; -webkit-transition:all 200ms ease-out; -moz-transition:all 200ms ease-out; -o-transition:all 200ms ease-out; Transition:all 200ms ease-out;}. Nav a:hover {color: #000; Background: #fff; Border-color: #000; padding:8px; top:-4px;}. Nav. Selected A,. Nav. Selected A:hover {background: #444; Color: #fff; Border-color: #000;}. nav2 {list-style:none;}. Nav2 Li {float:left; Position:relative;}. Nav2 a {Display:block; Float:left; Border:none; position:relative; height:22px; Overflow:hidden;}. Nav2 a strong,. Nav2 a em {cursor:pointer; PADDING:4PX 8px; Font-weight:bold; Font-style:normal; Display:block; -webkit-transition:all 200ms ease-out; -moz-transition:all 200ms ease-out; -o-transition:all 200ms ease-out; Transition:all 200ms ease-out;}. Nav2 a strong {position:relative; top:0; left:0; Color: #000; Background: #fff;}. nav2 em {position:absolute; top:100%; Background: #000; Color: #fff;}. Nav2 a:hover Strong {top:-100%;}. Nav2 a:hover em {top:0;} </style>
Supported browsers for Firefox, Chrome, Opera and Safari, for IE does not support transition,