我只是使用默认的 YouTube 嵌入代码(由 YouTube 生成)在我的网站上显示视频。由于 YouTube 播放器的布局使用相当窄的宽度(320 像素宽)，因此视频缩略图的质量非常低，并且明显像素化。但是，由于 YouTube 播放器使用相当宽的宽度(1100 像素宽)的布局，视频缩略图是高分辨率版本，看起来很棒。
以下是比较不同缩略图的两个链接:
- 狭窄、低质量的缩略图:http://slackrbike0.wpengine.com/
- 宽、高质量缩略图:http://slackrbike0.wpengine.com/?cat=1
有人遇到过较小的嵌入式视频的缩略图质量很差的问题吗？有人想出解决办法吗？或者我必须等待 YouTube 修复它吗？
这是我正在使用的嵌入代码，也是 YouTube 生成的默认代码:
<iframe width="560" height="315" src="https://www.youtube.com/embed/NoIKoTs1s9Y" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
最佳答案
基本上，YT 会发送多个尺寸的缩略图，如果您的容器小于 321px，则将加载最小的缩略图，即 "width": 120,"height": 90 。这是此问题的根本原因。
带有 width <= 320px 的元素存在隐藏缩略图的问题。
我找到了一种解决方法，通过使用 min-width:321px 设置 iframe 宽度这将强制加载更高维度的缩略图
iframe {
min-width:321px;
}
希望这对您有帮助。
关于youtube-api - YouTube 嵌入播放器 : Thumbnails are pixelated for small player, 但对于大型播放器来说看起来不错，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57080685/