page { background-color: #f6f7fb; } .header { width: 750rpx; padding-bottom: 20rpx; background-color: #ffffff; } .searchBox { display: flex; align-items: center; z-index: 2; } .searchBox_left { box-sizing: border-box; padding-left: 20rpx; position: absolute; left: 0; } .searchBox_mid { font-size: 32rpx; color: #222222; flex: 1; text-align: center; } /* 余额显示部分样式 */ .balance-container { width: 93%; height: 250rpx; background-color: #ffffff; margin-bottom: 15rpx; padding: 25rpx; } .balance-content { height: 100%; display: flex; position: relative; align-items: center; padding-left: 50rpx; color: #894b11; background: linear-gradient(to top right, #f6e2b7, #eab16a); border-radius: 25rpx; } .balance-title { font-size: 45rpx; font-weight: 500; margin-bottom: 20rpx; } .balance-amount { font-size: 70rpx; font-weight: 500; } .balance-icon { position: absolute; right: 50rpx; top: 50%; transform: translateY(-50%); width: 200rpx; height: 200rpx; border-radius: 20rpx; display: flex; align-items: center; justify-content: center; } .balance-icon image { width: 200rpx; height: 200rpx; } .balance-text { position: absolute; right: 50rpx; top: 50%; transform: translateY(-50%); width: 150rpx; height: 70rpx; border-radius: 20rpx; border: 1rpx solid #8b4e13; display: flex; align-items: center; justify-content: center; } /* 余额变动记录样式 */ .records-container { margin-top: 30rpx; padding: 0 40rpx; background-color: #ffffff; padding: 25rpx; } .tabs { display: flex; align-items: center; height: 100rpx; box-sizing: border-box; overflow-x: auto; white-space: nowrap; border-bottom: 1rpx solid #EEEEEE; } .tabItem { font-size: 30rpx; color: #222222; margin-right: 60rpx; white-space: nowrap; } .active2 { font-size: 30rpx; font-weight: 700; position: relative; } .active2::after { content: ''; background: url(https://static.hshuishang.com/property-img-file/com_active.png) no-repeat; background-size: 100% 100%; width: 52rpx; height: 22rpx; position: absolute; left: 50%; bottom: -16rpx; transform: translateX(-50%); } .records-title { font-size: 36rpx; font-weight: bold; color: #222222; margin-bottom: 30rpx; } .records-list { width: 100%; } .record-item { display: flex; justify-content: space-between; align-items: flex-start; padding: 30rpx 0; border-bottom: 1rpx solid #EEEEEE; } .record-info { flex: 1; } .record-name { font-size: 32rpx; color: #222222; margin-bottom: 10rpx; } .record-time { font-size: 26rpx; color: #999999; } .record-amount { text-align: right; } .amount-sign { font-size: 28rpx; } .amount-value { font-size: 36rpx; font-weight: bold; } .positive { color: #51c651; } .negative { color: #FF4444; } .record-balance { font-size: 26rpx; color: #999999; margin-top: 10rpx; }