老孙 2006-2016
2016年11月02日 18:39
今天找phpwind5.3无意中看到了当年用过的那些论...
AI摘要：这篇文章介绍了如何在自定义CSS中添加一个渐变色的背景。通过使用CSS的伪元素`::before`，可以在页面上创建一个覆盖整个屏幕的背景。然后使用线性渐变的背景颜色，并通过动画使背景颜色产生流动效果。代码示例展示了如何设置背景颜色和动画效果。
在自定义CSS中可以自定义背景
body::before {
content: '';
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: -520;
pointer-events: none;
}
body::before {
background: linear-gradient( 90deg, rgba(247, 149, 51, .1), rgba(243, 112, 85, .1) 15%, rgba(239, 78, 123, .1) 30%, rgba(161, 102, 171, .1) 44%, rgba(80, 115, 184, .1) 58%, rgba(16, 152, 173, .1) 72%, rgba(7, 179, 155, .1) 86%, rgba(109, 186, 130, .1)); /*背景颜色*/
background-size: 500%;
animation: bgAnimation 15s linear infinite; /*执行动画*/
}
@keyframes bgAnimation{
0%{
background-position: 0% 50%;
}
50%{
background-position: 100% 50%;
}
100%{
background-position: 0% 50%;
}
}加入一个渐变色的背景
