What is the concept of transition in css3

Today, the editor will share with you the relevant knowledge of what the concept of transition is in css3. The content is detailed and the logic is clear. I believe most people still know too much about this knowledge, so share this article for your reference. I hope you can get something after reading this article. Let's take a look at it.

Transition in css3 means "transition" and is an attribute used to set the transition effect of an element; this attribute is an abbreviated attribute that can add a transition animation effect to the element, and the parameters can be used to set the relevant operations of the transition animation. The syntax is "transition: attribute name time-velocity curve delay time".

The operating environment of this tutorial: windows10 system, CSS3&&HTML5 version, Dell G3 computer.

What does transition mean in css3

Transition means transition in css3.

The transition attribute sets the element when the transition effect

The four abbreviated properties are:

Transition-property

Transition-duration

Transition-timing-function

Transition-delay

The syntax is:

Transition: property duration timing-function delay

The parameters are as follows:

Examples are as follows:

123 div {width:100px;height:100px;background:red;transition:width 2s; / * Safari * /} div:hover {width:300px;}

Note: this instance does not work on Internet Explorer 9 and earlier IE versions.

Move the mouse over the div element to see the transition effect.

Output result:

These are all the contents of the article "what is the concept of transition in css3". Thank you for reading! I believe you will gain a lot after reading this article. The editor will update different knowledge for you every day. If you want to learn more knowledge, please pay attention to the industry information channel.