Rendering
CSS-Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | *{
margin : 0 ;
padding : 0 ;
}
body{
height : 100 vh;
width : 100% ;
overflow : hidden ;
background-image : linear-gradient( 125 deg, #F44336 , #E91E63 , #9C27B0 , #3F51B5 , #2196F3 );
background- size : 400% ;
font-family : "montserrat" ;
animation: bganimation 15 s infinite;
}
.text{
color : #fff ;
font-size : 22px ;
text-align : center ;
margin : 350px 0 ;
}
@keyframes bganimation{
0% {
background-position : 0% 50% ;
}
50% {
background-position : 100% 50% ;
}
100% {
background-position : 0% 50% ;
}
}
|
Nach dem Login kopieren
Empfohlenes Tutorial: "CSS-Tutorial 》
Das obige ist der detaillierte Inhalt vonCSS realisiert einen dynamischen Verlaufseffekt im Hintergrund. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!