New Start, new direction, new start direction

Source: Internet
Author: User

New Start, new direction, new start direction

From the march s to the present year, I found what I really want to do. Today I learned css3 and found that many syntaxes or writing formats have changed, at the same time, I also learned some new marks. Every day, I made a small step forward, accumulating, learning, and working hard.

For example:

Previous statement: <input type = "radio" value = "my" name = "sex" id = "my" checked> female </radio>;

Current statement: <input type = "radio" name = "sex"/> female;

We also learned a lot of new tags. For example: <blackquote>-reference text, border-radius-set rounded corner,

Background: linear-gradient for example: background: linear-gradient (45deg, red, yellow, blue); set the gradient of red, yellow, and blue colors from 45 degrees.

2D Conversion:

For example, you can use: transform: rotate (30deg); rotate 30 degrees

Animation: Animation is the effect of gradually changing an element from one style to another.

Animation: mx 5S linear infinite; (animation: animation name, time, gradient mode, playback Mode)

// The keywords "from" and "to" are equivalent to 0% and 100%.

// 0% indicates that the animation starts to show orange, and 100% indicates that the animation is finished and displayed in red.

 1st Methods: @ Keyframes mx {

From {background: orange ;}

To {background: red ;}

}

 2nd Methods: When the animation is 25% and 50%, the background color is changed, and then it is changed again when the animation is 100%:

@ Keyframes mx {0% {background: red;} 25% {background: yellow;} 50% {background: blue;} 100% {background: green ;}}
And so on .........

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.