点击查看代码
<view class="recommend-view">
<view class="title-view">
热门推荐
</view>
<view class="book-list">
<view class="book-item" v-for="item in list" :key="item.id" @click="listJump(item.anid)">
<image class="book-img" :src="item.coverpic"></image>
<view class="book-text ell2">{{item.title}}</view>
</view>
</view>
</view>
————————————————————
.recommend-view {
display: flex;
flex-wrap: wrap;
padding: 30rpx;
padding-right: 0;
.title-view {
font-size: 20px;
font-weight: 800;
}
.book-list {
display: flex;
flex-wrap: wrap;
.book-item {
width: 210rpx;
margin-top: 30rpx;
margin-right: 30rpx;
display: flex;
justify-content: center;
flex-wrap: wrap;
.book-img {
width: 180rpx;
height: 252rpx;
margin-bottom: 10rpx;
border: 1px solid rgb(107, 107, 109);
border-radius: 20rpx;
}
.book-text {
font-size: 28rpx;
}
}
}
}