page { background-color: #161616; width: 100%; height: 100%; } .page { background-color: #161616; width: 750rpx;height:100vh; background: url('../../static/w3/bg.png'); background-size: 750rpx 1624rpx; background-repeat: repeat-y; } .header { display: flex; flex-direction: row; justify-content: center; align-items: center; width: 750rpx;height: 320rpx; padding-top:30rpx; .bg { display: flex;flex-direction: row; width: 650rpx;height: 320rpx; background: url('../../static/w3/w3_bg_2.png'); background-size: 650rpx 320rpx; justify-content: center; padding-left:50rpx; .left { width:350rpx; display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start; .user { display: flex;flex-direction: row;justify-content: center;align-items: center;padding-top:44rpx; .avator { width:68rpx;height:68rpx;border-radius: 34rpx; } .iconV { width:78rpx;height:42rpx; } .nickname { font-weight: bold; font-size: 32rpx; color: #FFFFFF;padding-left: 8rpx;padding-right: 8rpx; } } .num { font-weight: bold;padding-top:64rpx; font-size: 64rpx; color: #FFFFFF; } .desc { font-weight: 400;padding-top:12rpx; font-size: 28rpx; color: #999999; display: flex;flex-direction: row;justify-content: center;align-items: center; image { width:36rpx;height:36rpx; } } } .right { width:300rpx;display: flex;flex-direction: column;justify-content: flex-start;align-items: center; .icon { width:250rpx;height:250rpx;margin-top:4rpx; } .arrow { width:30rpx; } .desc { padding-top:0rpx; font-weight: 400; font-size: 28rpx; color: #FFFFFF; display: flex;flex-direction: row;justify-content: center;align-items: center; image { width:36rpx;height:36rpx; } } } } } .thread { height: 20rpx; } .thread2 { height: 60rpx; } .sigin { display: flex;flex-direction: row;justify-content:flex-end;align-items: center; width: 650rpx;height: 180rpx;margin:10rpx auto; background: url('../../static/w3/signin.png'); background-size: 650rpx 180rpx; .btn { width:152rpx;height:72rpx;border-radius: 20rpx;margin-right:30rpx; background-color: #fff;font-weight: 400; display: flex;flex-direction: row;justify-content: center;align-items: center; } .gray { background-color: rgba(255, 255, 255, 0.7); } } .list_r { width:750rpx;display: flex;flex-direction: row;justify-content: flex-start;align-items: center;margin-top:20rpx; font-weight: bold;padding-left:40rpx; font-size: 32rpx; color: #FFFFFF; .item1 { width: 314rpx;height: 110rpx;margin-right:20rpx; background: url('../../static/w3/bg_c1_box.png'); background-size: 314rpx 110rpx; } .item2 { width: 314rpx;height: 110rpx; background: url('../../static/w3/bg_c1_share.png'); background-size: 314rpx 110rpx; } .item3 { width: 314rpx;height: 110rpx;margin-right:20rpx;margin-top:20rpx; background: url('../../static/w3/bg_c1_tran.png'); background-size: 314rpx 110rpx; } .item4 { width: 314rpx;height: 110rpx;margin-top:20rpx; background: url('../../static/w3/bg_c1_x.png'); background-size: 314rpx 110rpx; } } .list_item { width:690rpx;height:388rpx;display: flex;flex-direction: column;justify-content: flex-start;align-items: center; background: url('../../static/w3/bg_box2.png'); background-size: 690rpx 388rpx;margin:0 auto; .item1 { width:690rpx;height:70rpx; display: flex;flex-direction: row;justify-content: space-between;align-items: center; .left { font-weight: bold;padding-left:30rpx; font-size: 32rpx; color: #FFFFFF; } .right { font-weight: 400;padding-right:30rpx; font-size: 28rpx; color: #FFFFFF; } } .item2 { width:690rpx;height:318rpx; display: flex;flex-direction: row;justify-content: space-between;align-items: center; .left { width:280rpx;height:318rpx; display: flex;flex-direction: column;justify-content: center;align-items: center; image { width:168rpx; } .name { font-weight: bold;margin-top: 14rpx;text-align: left; font-size: 28rpx; color: #FFFFFF; } .time { font-weight: 400;margin-top: 14rpx;text-align: left; font-size: 24rpx; color: #999999; } } .right { width:410rpx; display: flex;flex-direction: column;justify-content: space-between;align-items: center; .content { font-weight: 400;font-size: 24rpx;color: #FFFFFF; padding-right:80rpx; } .act { width:100%;display: flex;flex-direction: row;justify-content: flex-end;align-items: center;padding-right: 30rpx;padding-top:20rpx; image { width:100rpx;height:32rpx; } .sign_name { font-weight: normal; font-size: 24rpx; color: #fff;margin-bottom: 16rpx; } } } } }