小程序video永远盖在所有元素上方是因为其为原生组件，在独立图层渲染，层级天然高于普通组件；唯一合法覆盖方案是cover-view，且必须为video直接子节点、小写标签、非自闭合、样式写class中。
小程序端video为什么永远盖在所有元素上面
因为微信小程序的 video 是原生组件，它不走 WebView 渲染流程，而是由客户端直接在独立图层绘制。这个图层天然高于所有普通 view、button、cover-view（注意：后者虽也是原生组件，但受限于小程序规范）——所以你调 z-index、改 position、加 transform 全都无效。
cover-view 是唯一合法且可用的覆盖方案
小程序官方只允许用 cover-view 和 cover-image 叠在 video 上，其他任何 DOM 类组件都不行。但它不是万能的，踩坑点很集中：
-
cover-view必须是video的直接子节点，嵌套一层view就失效 - 不支持
background-image、border-radius（部分基础圆角可生效，但安卓 iOS 行为不一致） - 事件绑定必须用
@tap等原生事件，v-on:click不触发 - 不能使用
flex布局的某些属性（如align-self），推荐用display: flex+justify-content/align-items组合 - 文字内容必须用
cover-view包裹的cover-view或cover-image，不能直接写文本节点
cover-view 写法必须严格符合小程序规范
下面这段是能真机生效的最小可行结构：
<video src="xxx.mp4" controls>
<cover-view class="control-bar">
<cover-view class="play-btn" @tap="togglePlay"></cover-view>
</cover-view>
</video>
关键点：
- 所有
cover-标签必须小写，且不能自闭合（<cover-view/>会报错） - 样式只能写在 class 中，内联
style属性在部分安卓机型上被忽略 - 层级顺序靠 DOM 位置决定：后写的
cover-view自动盖在先写的上面，不用管z-index - 如果需要响应式定位，用
top/left配合px或rpx，百分比值在某些低版本基础库中不支持
遇到 cover-view 不显示？先查这三件事
真机调试时 cover-view 消失，大概率不是代码逻辑问题，而是环境或配置错误：
- 确认当前运行环境是「微信小程序」，H5 或 App 端不走这套逻辑，
cover-view在 H5 下不渲染 - 检查基础库版本：微信开发者工具需 ≥ 2.10.4，真机需用户微信版本 ≥ 7.0.12（低于此版本
cover-view事件可能不触发） - 确认
video组件没有设置enable-danmu或danmu-btn—— 这两个属性会强制接管内部图层，导致自定义cover-view被屏蔽
复杂交互（比如弹幕+控制条+进度条）不要堆在一个 video 里硬塞，拆成多个 cover-view 并严格按 DOM 顺序排列，比试图用 CSS 控制更可靠。
