看起来你踩中了现代浏览器自动播放策略的坑——Opera GX、Edge这类基于Chromium内核的浏览器，对媒体自动播放的限制比Firefox更严格，哪怕你加了muted和autoplay，也可能因为细节没达标而“罢工”。我给你整理几个针对性的修复方案，都是基于你现有代码调整的，上手很简单：

1. 用JS兜底，确保播放触发时机 #

很多时候浏览器会因为视频元数据没加载完成，直接忽略autoplay属性。我们可以给视频加个ID，监听加载事件手动触发播放，甚至在自动播放失败时，用用户交互来兜底（这完全符合浏览器的安全策略）：

修改后的代码如下：

<video id="bgVideo" autoplay muted loop playsinline webkit-playsinline preload="metadata" disablepictureinpicture controlslist="nodownload nofullscreen noremoteplayback" class="bg-video">
  <source src="video.mp4" type="video/mp4">
</video>

<script>
  const bgVideo = document.getElementById('bgVideo');
  
  // 监听视频元数据加载完成，尝试触发播放
  bgVideo.addEventListener('loadedmetadata', async () => {
    try {
      await bgVideo.play();
    } catch (err) {
      // 如果自动播放失败，监听用户第一次点击页面后再播放
      document.body.addEventListener('click', () => {
        bgVideo.play();
      }, { once: true }); // 只触发一次，避免重复绑定
    }
  });
</script>

这里我顺便把preload="auto"改成了preload="metadata"，只加载视频元数据能更快触发后续播放逻辑，同时加了webkit-playsinline给Chromium内核浏览器做兼容双保险。

2. 检查视频编码和文件大小 #

如果代码调整后还是偶尔抽风，大概率是视频文件的问题：

• 确保你的MP4视频用的是H.264编码（这是所有现代浏览器都支持的标准编码），避免用HEVC这类兼容性差的编码；
• 尽量压缩视频体积，比如把码率降到2Mbps以内，分辨率适配你的页面宽度（比如1920px宽就够了）——太大的视频加载慢，浏览器可能会推迟播放。

3. 检查Opera GX的专属设置 #

Opera GX有自己的媒体控制逻辑，你可以排查下这些设置：

• 按Alt+P打开设置，搜索“自动播放”，确保把你的网站（或本地测试地址）加入自动播放白名单，或者直接设置“允许所有网站自动播放媒体”；
• 临时关闭Opera GX的省电模式和数据节省模式——这两个功能会默认限制媒体自动播放，用来节省资源。

4. 移除可能冲突的属性 #

有时候disablepictureinpicture、controlslist这类属性可能和自动播放逻辑有隐性冲突，你可以先临时移除这些属性测试，如果播放正常了，再逐个加回来排查哪个是“罪魁祸首”。

一般来说，先试方案1的代码调整，这是解决这类问题最通用的办法；如果还是不行，再排查视频文件和浏览器设置。多数情况下，结合JS的兜底逻辑，就能让背景视频在所有主流浏览器里稳定自动播放啦！