微信小程序 两种滑动方式（横向滑动，竖向滑动）详细及实例代码
更新时间：2017年01月13日 11:18:06 投稿：lqh
这篇文章主要介绍了微信小程序 两种滑动方式详细及实例代码的相关资料,这里对横向滑动和竖向滑动都做介绍，需要的朋友可以参考下
微信小程序 滑动方式
竖向滑动：
<scroll-view scroll-y="true" style="height: 200rpx;"> <view style="background: red; width: 200px; height: 100px; display: inline-block" ></view> <view style="background: green; width: 200px; height: 100px; display: inline-block"></view> <view style="background: blue; width: 200px; height: 100px; display: inline-block"></view> <view style="background: yellow; width: 200px; height: 100px; display: inline-block"></view> </scroll-view>
横向滑动：
<!-- white-space--> normal: 正常无变化(默认处理方式.文本自动处理换行.假如抵达容器边界内容会转到下一行) pre: 保持HTML源代码的空格与换行,等同与pre标签 nowrap: 强制文本在一行,除非遇到br换行标签 pre-wrap: 同pre属性,但是遇到超出容器范围的时候会自动换行 pre-line: 同pre属性,但是遇到连续空格会被看作一个空格 inherit: 继承
水平滚动
<scroll-view scroll-x="true" style=" white-space: nowrap; display: flex" > <view style="background: red; width: 200px; height: 100px; display: inline-block" ></view> <view style="background: green; width: 200px; height: 100px; display: inline-block"></view> <view style="background: blue; width: 200px; height: 100px; display: inline-block"></view> <view style="background: yellow; width: 200px; height: 100px; display: inline-block"></view> </scroll-view>
感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！
相关文章
这篇文章主要为大家介绍了微前端框架qiankun源码剖析，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-02-02
package.json中browser module main字段优先级对比
这篇文章主要介绍了package.json中browser module main字段的优先级详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-07-07
这篇文章主要介绍了微信小程序下拉刷新界面的实现的相关资料,希望通过本文能帮助到大家实现这样的功能，需要的朋友可以参考下2017-09-09
这篇文章主要为大家介绍了Javascript中bind()方法绑定函数的使用与实现示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-06-06
这篇文章主要讲解JavaScript严格模式不支持八进制的问题，本文围绕JavaScript严格模式展开内容，详细介绍为什么JavaScript严格模式不支持八进制，下面来看看详细介绍,需要的朋友可以参考一下2021-11-11
这篇文章主要为大家介绍了Web项目如何配置Eslint过程详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-09-09
这篇文章主要介绍了微信小程序 本地存储实例详解的相关资料,需要的朋友可以参考下2017-01-01
这篇文章主要介绍了TypeScript遍历对象属性的问题，文章围绕TypeScript遍历对象属性的相关资料展开详细内容,需要的朋友可以参考一下2021-11-11
微信小程序 后台https域名绑定和免费的https证书申请详解
这篇文章主要介绍了微信小程序 后台https域名绑定和免费的https证书申请详解的相关资料,需要的朋友可以参考下2016-11-11
这篇文章主要为大家介绍了JS轻量级函数式编程实现XDM示例详解第3/3篇，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-06-06
最新评论