收藏
回答

各位大佬,在学习scroll-view组件横向滚动的时候遇到的无法滚动的问题?







设置的父元素是400px,子元素是200px,为什么显示在页面中变成4等分,每个50px了,这样不能滚动了

回答关注问题邀请回答
收藏

4 个回答

  • 无
    2019-08-15

    删除scroll-view-H

    scroll-view{
      white‐space: nowrap;
    }
    scroll-view .scroll-view-item-H{
       displayinlineblock;
    }


    2019-08-15
    有用
    回复 2
    • Abner kong
      Abner kong
      2019-08-15
      懂了,谢谢
      2019-08-15
      回复
    • 禾店科技
      禾店科技
      2021-05-07
      好优秀
      2021-05-07
      1
      回复
  • 墨染的天空
    墨染的天空
    2019-08-15

    <scroll-view scroll-x style="width:400rpx;white-space: nowrap;overflow: hidden;">

    <view style="width:200rpx;height:80rpx;background:black;display:inline-block;"></view>

    <view style="width:200rpx;height:80rpx;background:green;display:inline-block;"></view>

    <view style="width:200rpx;height:80rpx;background:yellow;display:inline-block;"></view>

    <view style="width:200rpx;height:80rpx;background:red;display:inline-block;"></view>

    </scroll-view>


    2019-08-15
    有用
    回复 2
    • 墨染的天空
      墨染的天空
      2019-08-15
      display:inline-block;很重要
      2019-08-15
      回复
    • Abner kong
      Abner kong
      2019-08-15回复墨染的天空
      恩恩,明白了,谢谢你
      2019-08-15
      回复
  • 香蕉不是笨啦啦
    香蕉不是笨啦啦
    2019-08-15

    因为你用了flex布局

    2019-08-15
    有用
    回复 4
    • Abner kong
      Abner kong
      2019-08-15
      如果不用的话,view就无法水平排列了
      2019-08-15
      回复
    • 香蕉不是笨啦啦
      香蕉不是笨啦啦
      2019-08-15回复Abner kong
      子元素用display: inline-block;父元素用white-space: nowrap;禁止换行,补一下css基础吧
      2019-08-15
      回复
    • 香蕉不是笨啦啦
      香蕉不是笨啦啦
      2019-08-15回复Abner kong
      flex布局是默认不换行的,但是父元素长度宽不够就会挤压子元素宽度
      2019-08-15
      回复
    • Abner kong
      Abner kong
      2019-08-15回复香蕉不是笨啦啦
      好的,谢谢你
      2019-08-15
      回复
  • 1
    1
    2019-08-15

    scroll-view-H这个标签多余了,删了就好了

    2019-08-15
    有用
    回复 3
    • Abner kong
      Abner kong
      2019-08-15
      删了还是不行,四个item垂直排列了
      2019-08-15
      回复
    • 1
      1
      2019-08-15回复Abner kong
      scroll-view的style: display: flex; white-space: nowrap;
      2019-08-15
      回复
    • 1
      1
      2019-08-15回复Abner kong
      基础的css
      2019-08-15
      回复
登录 后发表内容
问题标签