.container { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; box-sizing: border-box; } .banner-bg{ width: 750rpx; height: 300rpx; } .search{ width: 600rpx; height: 60rpx; line-height: 60rpx; background: rgba(0, 0, 0, .4); border-radius: 30rpx; position: relative; margin: -30% 0%; } .banner image{ width: 40rpx; height: 40rpx; margin: 10rpx 10rpx 10rpx 60rpx; } .function_text{ display: block; /* width: 380rpx; */ width: 100%; text-align: left; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } .search input{ background: none; font-size: 0.3rem; position: absolute; /* margin-top: 5rpx; */ } .list_box{ margin-top: 30rpx; } .list_title { font-size: 40rpx; color: #156EF3; } .border_a{ width: 120rpx; height: 1rpx; background: #156EF3; margin-top: 20rpx; margin-left: 20%; } .border_b{ width: 200rpx; height: 1rpx; background: #156EF3; margin-top: 30rpx; } .list_content{ width:728rpx; height: auto; text-align: center; margin-top: 20rpx; } .list_b{ width:350rpx; height: 320rpx; float: left; margin-top: 10rpx; padding-left: 10rpx; } .list_b image{ width: 350rpx; height: 220rpx; } .list_b .list_title2{ width: 350rpx; height:auto; line-height: 45rpx; background: rgba(0, 0, 0, .4); border-radius: 10rpx; position: absolute; margin-top: -91rpx; } .list_title2 text{ width: 97%; color: #fff; font-size: 25rpx; text-align: left; padding-left: 10rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .list_b text{ float: left; } .list_btn1{ clear: both; width: 140rpx; height: 40rpx; background: #156EF3; line-height: 40rpx; font-size: 25rpx; color: #fff; border-radius: 5rpx; float: left; margin-left: orpx; margin-top: 10rpx; } .list_btn2{ width: 140rpx; height: 40rpx; line-height: 40rpx; font-size: 25rpx; color: #ccc; border-radius: 5rpx; float: left; margin-top: 10rpx; margin-left: 10rpx; }