当前位置: 移动技术网 > IT编程>开发语言>JavaScript > 小程序实践(十四):横向滚动列表

小程序实践(十四):横向滚动列表

2019年07月17日  | 移动技术网IT编程  | 我要评论
wxss文件样式 .item-image{ width: 80px; height: 80px; margin-right: 2px; } .item-image{ width: 80px; height: 80px; margin-right: 2px; } wxml 布局 ...

wxss文件样式

/*内层横向滚动列表*/
.rowitem {
    display: inline-block;
}
.scroll-x{
    white-space:nowrap;
    display:flex;
}
 .item-image{
   width: 80px;
   height: 80px;
   margin-right: 2px;
  }
 

wxml 布局

<scroll-view class="scroll-x" scroll-x="true" scroll-x>
        <view wx:for="{{pictures}}" class="rowitem">
            
            <image class="item-image" src="../../../image/icon_product.png" mode="aspectfill">
            </image>
        </view>
</scroll-view>

 

 

 

如您对本文有疑问或者有任何想说的,请 点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网