数据内容统计渐变色代码分享

<div id="panda_stat">
                        <style>
#caired{
height: 100%;
width: 100%;
margin: 0;
padding: 0;
font-family: "montserrat";
background-image: -webkit-linear-gradient(45deg,#2c3e50,#27ae60,#2980b9,#e74c3c,#8e44ad);
background-size: 400%;
animation: bganimation 15s infinite;
}
@keyframes bganimation {
0%{
background-position: 0% 50%;
}
50%{
background-position: 100% 50%;
}
100%{
background-position: 0% 50%;
}
}
#caired{border-radius: 10px;}
#caired .cai ul{display: flex;height: 150px;}
#caired .cai ul li{width: 20%; color: #fff; text-align: center;}
#caired .cai ul li p{font-size: 20px; font-weight: bold;}
#caired .cai ul li span{font-size: 40px; font-family: Arial;}
@media screen and (max-width: 768px){#caired .cai ul li span{font-size: 20px; font-family: Arial;}}
#caired .cai{font-weight:700;padding:20px 0 20px 0;}
/* 图标样式 */
#caired .cai ul li i {
    display: block;
    margin-bottom: 5px;
    font-size: 24px; /* 根据需要调整大小 */
}
</style> 
        
    <div id="caired">
    <div class="cai">
    <ul><li><i class="fa fa-users"></i><span>1489</span><p>会员总数</p></li><li><i class="fa fa-file-text-o"></i><span>26</span><p>文章总数</p></li><li><i class="fa fa-eye"></i><span>4637</span><p>浏览总数</p></li><li><i class="fa fa-calendar-o"></i><span>0</span><p>今日发布</p></li><li><i class="fa fa-rocket"></i><span>527天</span><p>稳定运行</p></li></ul>
    </div>
    </div>            </div>