/* pages/list/night/index.wxss */ page { background: #E6E5E3; padding-bottom: 30rpx; } .night-types { display: flex; justify-content: space-around; align-items: center; height: 86rpx; position: fixed; left: 0; right: 0; border-bottom: 1rpx solid #ccc; font-size: 29rpx; color: #333; background: white; z-index: 1; } .night-type { position: relative; width: 25%; text-align: center; height: 86rpx; line-height: 86rpx; } .night-type.active { color: #000; font-size: 33rpx; font-weight: 500; } .night-type.active::after { content: "1"; font-size: 0; display: block; position: absolute; width: 46rpx; height: 5rpx; background: #0B898E; border-radius: 3rpx; left: 50%; margin-left: -23rpx; bottom: 0; } .topImg { width: 750rpx; height: 333.33rpx; } .hotel-item { width: 700rpx; background: #FFFFFF; box-shadow: -1rpx 1rpx 16rpx 0rpx rgba(6, 0, 1, 0.1); border-radius: 13rpx; margin: 31rpx 25rpx; overflow: hidden; position: relative; } .hotel-item .headimg { display: block; width: 100%; height: 336rpx; } .hotel-item .infos { padding: 19rpx 24rpx; } .hotel-item .infos .textOver { font-weight: 500; color: #333; font-size: 31rpx; } .tags { display: flex; align-items: center; margin-top: 6rpx; } .tag { color: #0B898E; font-size: 20rpx; line-height: 30rpx; border-radius: 15rpx; padding: 0 15rpx; margin-right: 15rpx; border: 1rpx solid; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .price { font-size: 20rpx; color: #D62828; text-align: right; flex: 1; } .price text:nth-child(1){ font-size: 24rpx; } .price text:nth-child(2){ font-weight: 500; font-size: 33rpx; } .price text:nth-child(3){ color: #8D8D8D; margin-left: 4rpx; }