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

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>

 

 

 

posted @   听着music睡  阅读(2402)  评论(0编辑  收藏  举报
编辑推荐:
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?
历史上的今天:
2018-07-17 小程序实践(七):页面间传值
2013-07-17 安卓开发_复选按钮控件(CheckBox)的简单使用
点击右上角即可分享
微信分享提示