零基础学做网站培训介绍

当前位置:

微信小程序商品列表细节处理

以下为学做网站论坛关于“微信小程序商品列表细节处理”讲解视频教程。

在本案例的微信小程序中,商品列表每一项是左右各一个排列的,并且每一项使用了圆角处理。

第行二个并且左右各一个,这时我们需要使用flex布局。在WXSS中可以定义FLEX容器:


.proList{padding:10px 10px;box-sizing: border-box;display: flex;justify-content: space-between;flex-wrap: wrap;}

圆角处理,我们使用border-radius属性,通过border-radius属性控制圆角。


.proListLi{width:48%;margin-bottom: 20px;background:#fff;border-radius: 8px;overflow: hidden;}

本套课程完成的微信小程序案例下载链接: https://pan.baidu.com/s/1CCUwFpjV9bgg5ThCUuNayg 提取码: 6ip3

发表评论

邮箱地址不会被公开。 必填项已用*标注

相关教程