scroll-view 横向滚动失败主因是容器未显式设宽高、子元素未横向排齐；须设 container width/height、white-space: nowrap 在 scroll-view 上、子项用 inline-flex 或 flex 布局，并统一图片尺寸。
scroll-view 横向滚动图片失败，90% 是因为容器没“撑开”或子元素没“排齐”，不是 scroll-x 没开，也不是图片本身有问题。
scroll-x 开了但还是不能拖？先检查这三件事
很多开发者加了 scroll-x 就以为万事大吉，结果在真机上点不动、滑不了。核心问题往往出在布局链断裂：
-
scroll-view容器必须有明确的width（比如100%或固定值），不能依赖内容撑宽 - 子元素（
view包裹的image）必须横向排列且不换行，white-space: nowrap必须写在scroll-view上，不是子元素上 - 子元素不能用
display: block—— 它会独占一行，直接让横向滚动失效；得用inline-block或inline-flex
为什么 inline-block 有时会错位？改用 inline-flex 更稳
Android 微信小程序里，inline-block 元素之间常因 HTML 换行符产生 4px 左右的空白间隙，导致图片错位、滚动卡顿。这不是 bug，是浏览器对空白符的默认渲染行为。
-
inline-flex不受文本空白影响，子元素间距完全可控 - 记得给子
view加flex-direction: column（如果里面是图标+文字），避免内容被拉伸 - 若用
flex布局替代inline-flex，必须同时给scroll-view加display: flex; flex-direction: row，否则子项仍会竖排
图片宽高不一致导致滚动跳变？用固定尺寸 + object-fit
横向滚动时图片忽大忽小、滑动不顺，大概率是图片原始尺寸差异太大，又没约束容器盒模型。
- 给包裹
image的外层view设固定宽高（如width: 120px; height: 120px），别只设image自己 -
image标签加上mode="aspectFill"或mode="scaleToFill"，并设width: 100%; height: 100% - 避免用
width="100%"这类属性写在image标签里——uni-app 中它可能被忽略，样式必须走 CSS
小程序平台差异：微信和支付宝要额外加 display: flex
Web 端靠 white-space: nowrap + inline-block 就能跑通，但微信/支付宝小程序原生滚动层对 CSS 解析更严格，缺了 display: flex 就可能拒绝响应触摸事件。
- 在
.scroll-container类中，必须写：.scroll-container { display: flex; flex-direction: row; white-space: nowrap; overflow-x: auto; } - 不要只写
#ifdef MP-WEIXIN条件编译——支付宝小程序（MP-ALIPAY）同样需要 - 真机调试时，打开 Chrome DevTools 的 “Rendering” 面板，勾选 “Scrollable area” 可直观看到可滚动区域是否覆盖全部内容
最易被忽略的一点：scroll-view 的 height 必须显式设置（哪怕只是 height: 120px），否则在部分 Android 机型上，子元素高度计算为 0，整个滚动区域不可见也不可触。这个值不一定要和图片等高，但必须存在。
