Shulou(Shulou.com)06/01 Report--

This article will explain in detail how to use CSS3 to achieve the effect of snowflakes falling. The editor thinks it is very practical, so I share it with you as a reference. I hope you can get something after reading this article.

We can animate according to the animation effect we want, such as in this case:

The name of the animation is xuehua, the time for the animation to be completed is 15s, the speed of the animation is the same from the beginning to the end, and the animation has been played in a wireless loop.

Animation:xuehua15slinearinfinite

Program code

Body {

Background:#000

}

# xuehua {

Position:fixed

Left:0

Top:0

Right:0

Bottom:0

Background:url ('images/xuehua.png')

-webkit-animation:xuehua15slinearinfinite

Animation:snow15slinearinfinite

}

@ keyframesxuehua {

0% {

Background-position:00,00

}

100% {

Background-position:500px1000px,500px500px

}

}

@-webkit-keyframesxuehua {

0% {

Background-position:00,00

}

100% {

Background-position:500px1000px,500px500px

}

}

This is the end of this article on "how to use CSS3 to achieve the effect of snowflakes falling". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.