vue使用element实现横向滚动
用element也很简单,滚动条没有默认的那么丑…<div class="img-list"><el-scrollbar :vertical="true"><ul><li v-for="item in 6"><img src="" alt=""&g
·
用element也很简单,滚动条没有默认的那么丑…
<div class="img-list">
<el-scrollbar>
<ul>
<li v-for="item in 6">
<img src="你的图片地址" alt="">
</li>
</ul>
</el-scrollbar>
</div>
scss:
.img-list{
ul{
display: flex;
li{
display: inline-block;
max-width: 317px;
max-height: 211px;
margin: 0 49px;
background-color: #f4f4f4;
flex-shrink: 0;
img{
width: 100%;
height: 100%;
object-fit: cover;
}
}
}
}
说明:
flex-shrink:0;
不要压缩宽度,让宽度生效。
更多推荐
已为社区贡献3条内容
所有评论(0)