解决微信小程序scroll-view组件无横向滚动的问题

发布时间:2020-09-24 09:39:51 作者:flyyy菜鸟
来源:脚本之家 阅读:278

微信开放文档中scroll-view组件的部分代码如下

 <scroll-view class="scroll-view_H" scroll-x="true" bindscroll="scroll" >
     <view id="demo1" class="scroll-view-item_H demo-text-1"></view>
     <view id="demo2" class="scroll-view-item_H demo-text-2"></view>
     <view id="demo3" class="scroll-view-item_H demo-text-3"></view>
 </scroll-view>

要实现横向滚动,只需设置以下两个:

.scroll-view_H {
 /*设置display:flex无效*/
 white-space: nowrap; 
}
.scroll-view-item_H {
 width: 200rpx;
 height:200rpx;
 background-color: #f00;
 display: inline-block;
}

总结

以上所述是小编给大家介绍的解决微信小程序scroll-view组件无横向滚动的问题,希望对大家有所帮助!

推荐阅读:
  1. 微信小程序如何实现横向滚动导航栏
  2. 微信小程序scroll-view锚点链接滚动跳转功能

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

微信小程序 scroll-view 组件

上一篇:css中如何使用margin-top属性

下一篇:pandas.DataFrame的pivot()和unstack()实现行转列

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》