<scroll-view class="box" scroll-x="true" >
<view class="box-item" ></view>
<view class="box-item" ></view>
<view class="box-item" ></view>
</scroll-view>
.box {
width:100vw;
height: 200rpx;
white-space: nowrap; /*white-space 不能丢*/
border: 1px solid red;
box-sizing: border-box
} .box-item {
width: 45%;
height:100%;
border:2rpx solid green;
box-sizing: border-box;
display: inline-block
}


小程序scroll-view 使用的更多相关文章

  1. 微信小程序 -- scroll view

    效果图:横向滚动和纵向滚动 scroll view使用方法文档,前面已经介绍查找文档方法,此处不再赘述 一.横向滚动 创建一个页面scroll-nav 然后,在.wxml文件中排版 <!--水平 ...

  2. 关于微信小程序获取view的动态高度填坑

    wx.createSelectorQuery().select('#box').boundingClientRect(function (rect) { width = rect.width heig ...

  3. 微信小程序scroll标签的测试

    一:testscroll.wxml的代码如下.testview.js自动生成示例代码 //testscroll.wxml <view class="section__title&quo ...

  4. 小程序获取view元素的高度

    页面wxml <!--page/index/index.wxml--> <view id='demo'> <text>哈哈哈哈哈</text> < ...

  5. 【微信小程序】view顶部固定或底部固定 + scroll-view中的元素view也可以使用position:fixed;固定选中元素位置

    1.顶端固定核心代码如下: <view class="page__hd" style="position:fixed; top:0;width: 750rpx;&q ...

  6. 微信小程序将view动态填满全屏

    一.在app.js利用官方方法获取设备信息,将获取到的screenHeight.windowHeight度量单位统一由rpx换算为px 注:官方文档给出 [rpx换算px (屏幕宽度/750)  ][ ...

  7. 关于小程序去除view/navigator 点击后默认阴影效果

    hover:class  :定义容器在被触发时的样式 通常无用,但若不去除则影响用户体验: 为避免被覆盖,约定在wxss底部添加class,比如: <!-- wxml --> <na ...

  8. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  9. 原生开发小程序 和 wepy 、 mpvue 对比

    1.三者的开发文档以及介绍: 原生开发小程序文档:点此进入 wepy 开发文档:点此进入 mpvue 开发文档:点此进入 2.三者的简单对比: 以下用一张图来简单概括三者的区别: 小程序支持的是 WX ...

  10. 微信小程序~基础组件

    (1)视图容器 名称 功能说明 movable-view 可移动的视图容器,在页面中可以拖拽滑动 cover-image 覆盖在原生组件之上的图片视图 cover-view 覆盖在原生组件之上的文本视 ...

随机推荐

  1. 网站添加logo图片

    网站添加log图片 第一种方法 这里使用的图片一般为16*16大小的图片 <link rel="shortcut icon" href="http://xxx.xx ...

  2. 55、servlet3.0-ServletContext注册三大组件

    55.servlet3.0-ServletContext注册三大组件 使用ServletContext 注册 Servlet.Filter.Listener 使用编码的方式,在项目启动的时候给 Ser ...

  3. MySQL优化时怎么入手?慢查询怎么优化?

    1.数据类型优化 2.创建高性能索引 3.架构底层配置方面 4.硬件 慢查询: 1.定位慢查询 首先先打开慢查询日志设置慢查询时间 2.分析慢查询(使用explain工具分析sql语句) 3.优化慢查 ...

  4. The database principal owns a schema in the database, and cannot be dropped. (.Net SqlClient Data Pr

    解决microsoft sql server error:15138的方法 http://blog.csdn.net/gray13/article/details/4458523 用sp_change ...

  5. TensorFlow(三):非线性回归

    import tensorflow as tf import numpy as np import matplotlib.pyplot as plt # 非线性回归 # 使用numpy生成200个随机 ...

  6. NetworkX系列教程(8)-Drawing Graph

    小书匠Graph图论 如果只是简单使用nx.draw,是无法定制出自己需要的graph,并且这样的graph内的点坐标的不定的,运行一次变一次,实际中一般是要求固定的位置,这就需要到布局的概念了.详细 ...

  7. [access]第一篇-平台

    [access]第一篇-平台 上海盟威软件有限公司http://www.accessoft.com/ 下载地址http://www.accessgood.com/ 中山市天鸣科技发展有限公司http: ...

  8. BigDecimal进行除法运算时的坑

      循环小数输出的坑 BigDecimal做除法时如果出现除不尽(循环小数)的情况,会抛异常: BigDecimal a = new BigDecimal("1"); System ...

  9. 利用layer制作好看的弹出框

    一.下载layer http://layer.layui.com/ 二.效果图 三.代码 <!DOCTYPE html> <html lang="en"> ...

  10. linux ssh终端解决中文乱码的问题

    @1:第一种办法: 在linux服务器里 命令行修改Linux服务器文件: vi /etc/sysconfig/i18n 默认的内容为: LANG="zh_CN.UTF-8" ; ...