.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; } }