如何为Qt widget中嵌入的YouTube视频添加圆角边框？

直接给#player元素加borderRadius只能给播放器外围容器加圆角，没法裁剪视频内容本身，要实现视频画面的圆角效果，得用容器包裹+溢出裁剪的思路，具体操作如下：

1. 给播放器套一个带圆角的父容器，用它来裁剪视频内容

<!-- 创建带圆角的容器 -->
<div id="player-wrap" style="border-radius: 12px; overflow: hidden; width: 640px; height: 360px;">
  <!-- 原YouTube播放器放在这个容器内 -->
  <div id="player"></div>
</div>

2. 调整播放器样式，填满容器并清除自身边框设置

const player = document.getElementById('player');
// 移除播放器自身的边框和圆角
player.style.border = 'none';
player.style.borderRadius = '0';
// 让播放器完全填满父容器，避免出现间隙
player.style.width = '100%';
player.style.height = '100%';
player.style.position = 'absolute';
player.style.top = '0';
player.style.left = '0';

3. 确保Qt WebView支持CSS裁剪
   如果使用QWebEngineView，默认支持overflow: hidden特性；若遇到渲染异常，检查是否开启了高DPI缩放（Qt::AA_EnableHighDpiScaling），同时确认WebView未禁用CSS相关渲染功能。

原理说明 #

YouTube播放器内部属于独立渲染层级，直接给外层#player元素加圆角仅会修饰容器边框，无法影响内部视频画面。通过父容器的overflow: hidden，可以把超出圆角范围的视频内容裁切掉，从而实现视频本身的圆角效果，和你参考的iframe示例核心思路一致。

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