看起来你已经找对了响应式嵌入的核心思路，但现有代码里有几个关键细节没处理好，导致可能无法正常工作。我来帮你修正并完善这个方案：

先说说你现有代码的问题 #

• src 属性只写了 https://www.vimeo.com，这是Vimeo的主页地址，不是具体视频的嵌入链接，必须替换成目标视频的专属嵌入地址
• framebo... 应该是未写完的 frameborder="0"，现代HTML里更推荐用CSS的 border:0 替代这个属性
• 缺少Vimeo嵌入必需的权限参数（比如全屏、自动播放权限）

完整的响应式嵌入方案 #

1. 响应式容器CSS（你的基础代码没问题，补充了兼容性和美化细节） #

.video-responsive {
  overflow: hidden;
  padding-bottom: 56.25%; /* 固定16:9比例，匹配绝大多数视频的宽高比 */
  position: relative;
  height: 0;
  /* 可选美化：添加内边距和阴影 */
  margin: 1rem 0;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.video-responsive iframe {
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  position: absolute;
  border: 0; /* 替代frameborder="0"，符合现代HTML标准 */
}

2. 正确的HTML嵌入代码 #

你需要从Vimeo视频页面获取专属嵌入链接：打开目标视频 → 点击「分享」→「嵌入」，复制里面的src地址（格式为https://player.vimeo.com/video/[视频ID]），然后替换到代码中：

<div class="video-responsive">
  <iframe 
    src="https://player.vimeo.com/video/123456789" <!-- 把123456789换成你的视频ID -->
    allow="autoplay; fullscreen; picture-in-picture"
    allowfullscreen>
  </iframe>
</div>

关键注意事项 #

• 嵌入权限检查：如果视频是私有或密码保护的，需要在Vimeo视频设置的「嵌入」选项中开启嵌入权限
• 自定义参数：可以在src后添加参数实现功能，比如?autoplay=1&muted=1实现静音自动播放（浏览器通常要求静音才允许自动播放），?loop=1开启循环播放
• 宽高比调整：如果你的视频不是16:9，修改padding-bottom的值即可，比如4:3比例对应75%

这样调整后，视频就能在各种屏幕尺寸下自适应显示了。

内容的提问来源于stack exchange，提问作者Blues Clues