overscroll-behavior-y 通过阻断滚动链而非直接禁用下拉刷新来生效：当子容器（如 .modal__content）触顶时，contain 值阻止过滚动事件向父级冒泡，使浏览器收不到页面级信号；该属性在 ios safari 的 html/body 上无效，仅对满足 overflow-y: auto、明确高度及真实溢出的非根滚动容器生效。
overscroll-behavior-y 为什么能干预下拉刷新
它不直接“禁用下拉刷新”，而是切断触发刷新所需的事件传播链——当用户在可滚动容器内拉到顶部时，overscroll-behavior-y: contain 阻止该容器的过滚动行为向父级（如页面根）冒泡，从而让浏览器收不到“页面级垂直过滚动”信号，自然不触发原生刷新。
body { overscroll-behavior-y: contain } 在 iOS 上根本无效
iOS Safari（包括 iOS 16.4 之前所有版本）会忽略作用于 html 或 body 的 overscroll-behavior 声明，computed 样式中该属性显示为灰色禁用状态。这不是写法问题，是 WebKit 内核对根元素的硬性限制。
- 真正起效的位置必须是「实际发生滚动的子容器」，比如
.modal__content、#chat-list或.scroll-view__content - 该容器必须同时满足：有明确高度（如
max-height: 70vh）、overflow-y: auto、内容真实溢出（否则浏览器不认为它是可滚动上下文） - uni-app 或微信小程序中，需穿透到内部节点，例如
::deep(.uni-scroll-view-content)或scroll-view::after渲染层
contain 和 none 在下拉场景中的关键区别
overscroll-behavior-y: contain 是嵌套滚动场景的默认选择；none 是高风险操作，只适合强隔离场景。
-
contain允许当前容器触顶/底时保留轻微弹性回弹（iOS 橡皮筋），但阻止事件向上传播 → 背景页不滚动、不刷新，输入框获焦后仍能自动滚动定位 -
none彻底禁用本层所有过滚动反馈（包括回弹动画和下拉提示），可能破坏依赖 scroll 事件的第三方库（如自定义下拉刷新组件），或导致键盘唤起时 input 不自动滚动 - 横向轮播图只需约束 X 轴：
overscroll-behavior-x: contain; overscroll-behavior-y: auto
Chrome 桌面/触控设备必须关 flags 才能生效
仅靠 CSS 无法在 Chrome 中彻底屏蔽下拉刷新——因为它的原生刷新由 overscroll-history-navigation 机制驱动，CSS 层面只是兜底。
- 必须访问
chrome://flags/#overscroll-history-navigation，将选项设为 Disabled 并重启浏览器 - 之后再加
body { overscroll-behavior-y: contain }或更推荐的容器级设置，才能防止误触穿透 - Android 移动端 Chrome 可临时切换为桌面模式（长按地址栏 → 开启「在桌面版网站上查看」），绕过 WebView 的手势识别链路
老 iOS（iOS 15 及以下）不支持该属性，JS 降级必须谨慎：touchmove 中只对非目标滚动区调用 e.preventDefault()，且必须传 { passive: false }，否则在 iOS Safari 15+ 和 Chrome 中会被静默忽略。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
