How to use the method of Css3 transition gradient

This article mainly introduces "how to use the method of Css3 transition gradient". In daily operation, I believe that many people have doubts about how to use the method of Css3 transition gradient. The editor has consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful to answer the doubts of "how to use the method of Css3 transition gradient". Next, please follow the editor to study!

Transition gradient:

CSS3 gradient (gradients) allows you to show a smooth transition between two or more specified colors.

-webkit-gradient (gradient type, start point, end point, [start color, end color, transition color])

Linear gradient (Linear Gradients)-down / up / left / right / diagonal

Radial gradient (Radial Gradients)-defined by their center

Linear-gradient (Color 1, Color 2)

Use of linear gradients:

Radial-gradient

Uniform color distribution

Background:-webkit-radial-gradient (red, green, blue)

Colors are distributed as a percentage

Background:-webkit-radial-gradient (red 5%, green 15%, blue 60%)

Case list:

Untitled document

# dv {

Border:1px solid # 000

Width:150px

Height:150px

/ * background:-webkit-radial-gradient (red, green, blue)

Background:-webkit-radial-gradient (red 5%, green 15%, blue 60%); * /

Background:-webkit-radial-gradient (red, yellow, green)

}

At this point, the study on "how to use the method of Css3 transition gradient" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!