.microIndex .banner { position: relative; width: 100%; min-height: 320rpx; } .microIndex .banner .searchcontent { width: 672rpx; height: 60.16rpx; line-height: 60.16rpx; background-color: #fff; border-radius: 30.08rpx; position: absolute; top: 16rpx; left: 50%; margin-left: -336rpx; font-size: 28.16rpx; color: #8c8c8c; } .microIndex .banner .searchcontent .content { display: flex; align-items: center; } .microIndex .banner .searchcontent .content .left { margin-left: 10rpx; } .microIndex .banner .img_contetnt image { width: 100%; } .microIndex .banner .bottomcontent { position: absolute; width: 160rpx; height: 96rpx; background-color: rgba(0, 0, 0, 0.5); border-radius: 16rpx; right: 32rpx; bottom: 32rpx; } .microIndex .banner .bottomcontent .top, .microIndex .banner .bottomcontent .bottom { display: flex; align-items: center; height: 48rpx; } .microIndex .banner .bottomcontent .left { margin-left: 24rpx; margin-right: 15.04rpx; width: 32rpx; height: 32rpx; } .microIndex .banner .bottomcontent .left image { width: 100%; height: 100%; } .microIndex .banner .bottomcontent .right { font-size: 32rpx; font-weight: normal; line-height: 32rpx; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; max-width: 80rpx; } .microIndex .milist { background-color: #fff; padding-top: 30.08rpx; } .microIndex .milist .ul { display: flex; flex-wrap: wrap; } .microIndex .milist .ul .li { display: flex; flex-direction: column; align-items: center; flex: 0 0 20%; margin-bottom: 29.12rpx; } .microIndex .milist .ul .li .top { width: 96rpx; height: 96rpx; border-radius: 24rpx; margin-bottom: 20.16rpx; } .microIndex .milist .ul .li .top image { width: 100%; height: 100%; } .microIndex .milist .ul .li .bottom { height: 32rpx; font-size: 25.92rpx; line-height: 32rpx; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; max-width: 105rpx; } .microIndex .centerbanner image { width: 100%; } .video_list{ min-height: 100vh; } .microIndex .video_list .ul { margin-top: 16rpx; display: flex; flex-wrap: wrap; padding-left: 24rpx; padding-right: 24rpx; justify-content: space-between; } .microIndex .video_list .ul .li { border-radius: 12.16rpx; width: 338.88rpx; background-color: #fff; padding-bottom: 22.08rpx; margin-bottom: 24rpx; } .microIndex .video_list .ul .li .top { min-height: 449.92rpx; } .microIndex .video_list .ul .li .top image { width: 100%; } .microIndex .video_list .ul .li .bottom { padding-left: 18.88rpx; } .microIndex .video_list .ul .li .bottom .title { padding-top: 20.16rpx; font-size: 26.88rpx; line-height: 26.88rpx; display: -webkit-box; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-align: left; margin-bottom: 18.88rpx; } .microIndex .video_list .ul .li .bottom .content { display: flex; justify-content: space-between; } .microIndex .video_list .ul .li .bottom .content .headmessage { display: flex; } .microIndex .video_list .ul .li .bottom .content .headmessage .left { width: 36.16rpx; height: 36.16rpx; border-radius: 50%; } .microIndex .video_list .ul .li .bottom .content .headmessage .left image { width: 100%; height: 100%; } .microIndex .video_list .ul .li .bottom .content .headmessage .name { margin-left: 9.92rpx; height: 36.16rpx; line-height: 36.16rpx; text-align: left; color: #8c8c8c; font-size: 22.08rpx; } .microIndex .video_list .ul .li .bottom .content .thumbup { display: flex; padding-top: 5.12rpx; } .microIndex .video_list .ul .li .bottom .content .thumbup .right { width: 25.92rpx; height: 26.88rpx; margin-right: 12.16rpx; } .microIndex .video_list .ul .li .bottom .content .thumbup .right image { width: 100%; height: 100%; } .microIndex .video_list .ul .li .bottom .content .thumbup .num { min-width: 64rpx; max-width: 256rpx; text-align: left; color: #333; font-size: 24rpx; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .erweima { width: 100%; height: 100%; } .cate-box { display: flex; padding: 16rpx; background: #fff; width: 95%; overflow: scroll; } .cate-box .cate-child-box { height: 40rpx; line-height: 36rpx; padding: 0 16rpx; background: #f3f3f3; border: 1rpx solid #f3f3f3; border-radius: 32rpx; overflow: hidden; margin-right: 16rpx; font-size: 10px; color: #666; flex-shrink: 0; } .cate-box .active-cate-child { border: 1rpx solid #e35151; background: #fff; color: #e35151; } .load { text-align: center; } .load image { width: 90rpx; } .van-tabs__content{ min-height: 100vh; }