微信小程序开发-02

「已注销」 2021-11-25 11:20:05

前言

学习课程来自CSDN 1_bit

https://blog.csdn.net/a757291228/category_11488917.html


尺寸单位rpx和px的区别

rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。

如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。

微信小程序也支持rem尺寸单位,rem和rpx的换算关系:rem: 规定屏幕宽度为20rem;1rem = (750/20)rpx

1rem相当于屏幕大小的1/20,1rpx相当于屏幕的1/750。


flex-direction

flex-direction: row;

默认值。灵活的项目将水平显示,正如一个行一样。

image-20211124221528414

flex-direction: row-reverse;

与 row 相同,但是以相反的顺序。

image-20211124221629473

flex-direction: column;

灵活的项目将垂直显示,正如一个列一样。

image-20211124221717841

flex-direction: column-reverse;

与 column 相同,但是以相反的顺序。

image-20211124221735506

flex-direction: initial;

设置该属性为它的默认值。

image-20211124221758841

flex-direction: inherit;

从父元素继承该属性。

小程序:wx:for里面的item,index。以及自定义属性data-xxx的用法(双层循环取下标)。

通俗来说,

wx:for 这个是正常的循环,没什么可说的。

wx:for-item=‘变量名(随便起)’ 它是指定循环数据当前的变量名,可以通过 {undefined{变量名.属性}} 展示数组的元素。

wx:for-index=‘变量名(随便起)’ 它是指向当前元素的下标名,可以在其他事件中定义自定义事件(data-xxx='{undefined{变量名}}',,该自定义属性可以在参数e下面打印出来)获取该下标。

...全文
152 2 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
2 条回复
切换为时间正序
请发表友善的回复…
发表回复
WeiComp 新手村气氛调节师 2021-11-25
  • 打赏
  • 举报
回复

学习学习,打卡打卡!!!

0M01M1 2021-11-25
  • 打赏
  • 举报
回复
学习学习了

67,945

社区成员

发帖
与我相关
我的任务
社区描述
灌水发信息每周送书 灌水发干货每周送惊喜 谁最水过年送大礼 谁最硬核过年送大礼 谁最贡献过年送大礼
社区管理员
  • 1_bit
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告

我们“新手村”社区就是大家的孵化器

你们学习,我来评分

每周最高分送一本书

每月第四周送一份机械键盘

咱们新手村使用一切狂暴手段让优秀的人得到奖励

 

试试用AI创作助手写篇文章吧