画中画小窗可让B站视频悬浮播放不遮挡VS Code：右键视频画面选“画中画”（最简方式）；或聚焦视频后按Ctrl+Shift+P（Win/Linux）/Cmd+Shift+P（macOS）；若被禁用，需在chrome://settings/content/pictureInPicture中添加域名白名单；终极方案是开发者工具执行document.querySelector('video').requestPictureInPicture()。
你正在对照B站技术分享视频调试代码，每次切到VS Code写几行就错过关键操作演示，需要让视频脱离网页、悬浮在所有窗口最上方持续播放——这正是画中画小窗要解决的实际问题。
右键菜单直接启用（最快通用法）
这是绝大多数现代浏览器（Chrome、Edge、Firefox、Safari）都支持的原生方式，无需设置、不依赖扩展，只要视频已开始播放就能用。
将鼠标精准悬停在视频画面本体上（避开进度条、弹幕层、标题栏等非video区域），单击右键→在弹出菜单中选择【画中画】或【在画中画中播放】。
注意：如果右键菜单里压根没有这个选项，不是浏览器坏了，而是当前网站主动禁用了上下文菜单，必须换用快捷键或白名单方案。
键盘快捷键强制触发（绕过网页限制）
当右键失效、鼠标不便操作，或想在触控屏/远程桌面环境快速切换时，快捷键是更底层、更可靠的路径。
第一步：点击视频任意位置一次，确认视频边框出现浅蓝色虚线聚焦框——【没有这个聚焦框就按快捷键，100%无响应】。
第二步：按下 Ctrl + Shift + P（Windows/Linux）或 Command + Shift + P（macOS）。
第三步：悬浮窗口将在1秒内生成，自动继承当前播放时间点、音量大小和静音状态；拖拽顶部标题栏即可移至屏幕角落，完全不干扰你正在编辑的代码或文档。
为被拦截的网站手动添加白名单
企业内网培训系统、学校课程平台或部分老CMS常因内容安全策略（CSP）默认拒绝画中画权限，导致右键和快捷键全部灰显不可用——此时必须手动授权域名。
在Chrome或Edge地址栏输入 chrome://settings/content/pictureInPicture 或 edge://settings/content/pictureInPicture 并回车。
滚动到底部找到“允许以下网站使用画中画”区域，点击【添加】按钮。
输入目标网站的完整主域名，例如：course.university.edu.cn 或 training.company.com（注意：【不带 http://、https://，也不含路径或端口号】）。
点击“添加”后刷新原网页，重新播放视频，再尝试右键或快捷键操作。
开发者工具执行JavaScript命令（终极备用方案）
方法一：打开开发者工具（F12 或 Ctrl+Shift+J / Cmd+Option+J）→ 切换到 Console 标签页 → 输入 document.querySelector('video').requestPictureInPicture() 并回车。
方法二：若页面存在多个 video 元素（如嵌入广告、预加载片段），先运行 document.querySelectorAll('video') 查看列表，再用 document.querySelectorAll('video')[0].requestPictureInPicture() 指定第一个视频触发。
这一步操作起来很简单，直接把代码粘贴进去按回车就行。但要注意：必须确保视频已加载并处于可见播放状态，否则会报错“Cannot read property 'requestPictureInPicture' of null”。
