@charset "utf-8"; .noMore { padding: 20rpx; color: #bbb; text-align: center; font-size: 22rpx; } .c-a4 { color: #a4a4a4; } .c-red { color: #FF6768; } page { background-color: #f0f0f0; } .tab-title { display: flex; position: sticky; background-color: white; top: 0; font-size: 30rpx; z-index: 999; } .tab-title::after { position: absolute; content: ''; width: 2rpx; height: 40%; background-color: #f0f0f0; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .tab-title-item { flex: 1; text-align: center; padding-top: 20rpx; padding-bottom: 20rpx; position: relative; } .tab-title-item.active { color: #FF6768; font-weight: bold; } .tab-title-item::after { position: absolute; content: ''; left: 100%; bottom: 0; width: 0; border-bottom: 2rpx solid #FF6768; /* height: 3rpx; */ transition: 0.2s all linear; } .tab-title-item.active::after { /* left: 100%; */ width: 100%; left: 0; /* background-color: #FF6768; */ /* transition-delay: 0.1s; */ } .tab-title-item.active ~ .tab-title-item::after { /* width: 100%; */ left: 0; } .list { padding: 20rpx 20rpx 0 20rpx; } .item { background-color: white; border-radius: 8rpx; overflow: hidden; } .item ~ .item { margin-top: 20rpx; } .rmb::before { content: '¥'; }