.rank__list_module { width:366px; height:523px; background:rgba(71,28,230,1); border-radius:6px; margin: 16px auto 0; .rank__table_head { width: 100%; height:38px; background:rgba(89,112,255,1); border-radius:5px 5px 0px 0px; display: flex; justify-content: center; align-items: center; .table_head { display: flex; justify-content: center; align-items: center; color: #fff; font-size: 14px; font-weight: 400; } } .rank__table_body { height: 504px; overflow: auto; .table__tr { height: 48px; display: flex; justify-content: center; align-items: center; &:nth-child(1) { .table_head__sort { background: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/gold.png') 50% 50% no-repeat; background-size: 14px 18px; } } &:nth-child(2) { .table_head__sort { background: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/silver.png') 50% 50% no-repeat; background-size: 14px 18px; } } &:nth-child(3) { .table_head__sort { background: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/copper.png') 50% 50% no-repeat; background-size: 14px 18px; } } &:nth-child(2n) { background:#3900C9; } .table__body { font-size:12px; font-weight:400; color:rgba(255,255,254,1); display: flex; align-items: center; justify-content: center; height: 100%; } .table_head__user_info { .user__avatar { width: 18px; height: 18px; border-radius: 50%; margin-right: 6px; } .user__name { width: 86px; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } .table_head__prize { display: inline-block; line-height: 48px; text-align: start; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } } .table_head__sort { width: 50px; } .table_head__user_info { width: 110px; } .table_head__time { width: 58px; } .table_head__score { width: 58px; } .table_head__prize { width: 90px; } }