vue使⽤element实现横向滚动⽤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{
element表格横向滚动条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;
不要压缩宽度,让宽度⽣效。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论