.issue-item { width:100%; background: #fff; /* border-radius: 16rpx; */ box-sizing: border-box; padding: 0 30rpx; overflow: hidden; margin-bottom: 15rpx; } .issue-item .header { width:100%; height: 64rpx; display: flex; align-items: center; justify-content: space-between; margin-top: 36rpx; } .issue-item .header .info { display: flex; align-items: center; } .issue-item .header .info .avatar { width: 64rpx; height: 64rpx; border-radius: 8rpx; object-fit: cover; } .issue-item .header .info .name { font-size: 28rpx; color: #333; margin: 0 9rpx 0 13rpx; } .issue-item .header .info .dang { width:24rpx; height:24rpx; object-fit: cover; } .issue-item .header .issue-state { height: 34rpx; background: #FFC438; line-height: 34rpx; color: #fff; font-size: 22rpx; border-radius: 16rpx; text-align: center; padding: 0 10rpx; } .issue-item .content { color: #333; font-size: 36rpx; line-height: 52rpx; margin-top: 27rpx; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; white-space: normal !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .issue-item .image-list { width:100%; margin-top: 23rpx; display: grid; grid-template-columns: repeat(auto-fit, minmax(216rpx, 1fr)); grid-gap: 7rpx; } .issue-item .image-list .image-item { width: 100%; height: 100%; object-fit: cover; border-radius: 8rpx; } .issue-item .issue-type { font-size: 28rpx; color: #FFB400; line-height: 48rpx; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .issue-item .hot-remark { width: 100%; height: 120rpx; background: #f2f2f2; border-radius: 16rpx; box-sizing: border-box; padding: 0 20rpx; overflow: hidden; margin-top: 24rpx; } .issue-item .hot-remark .top { display: flex; align-items: center; justify-content: space-between; margin-top: 22rpx; } .issue-item .hot-remark .top .left { display: flex; align-items: center; } .issue-item .hot-remark .top .left image { width: 26rpx; height: 26rpx; object-fit: cover; } .issue-item .hot-remark .top .left view { font-size: 24rpx; color: #FF4B2D; margin-left: 8rpx; } .issue-item .hot-remark .top .right { font-size: 20rpx; color: #999; } .issue-item .hot-remark .top .right text + text { margin-left: 10rpx; } .issue-item .hot-remark .bottom { width:100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 30rpx; color: #666; line-height: 62rpx; } .issue-item .altitude { display: flex; align-items: center; justify-content: space-between; height: 87rpx; color: #999; font-size: 22rpx; } .issue-item .altitude .left { flex: 1; } .issue-item .altitude .right { flex: 1; display: flex; height: 100%; align-items: center; justify-content: space-between; }