我遇到的情況是，設(shè)置的視頻object-fit: cover在嘗試播放視頻時其海報被拉伸。海報被拉伸到 2:1 的寬高比，我注意到video如果沒有應(yīng)用樣式，這是默認(rèn)標(biāo)簽的默認(rèn)比例。我無法在其他瀏覽器中重現(xiàn)，并且它似乎與 CSS 設(shè)置無關(guān)。重現(xiàn)的最小代碼如下所示：<!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Video Error Test</title> </head> <body> <style> video { width: 300px; height: 600px; object-fit: cover; } </style> <video poster="https://via.placeholder.com/300x600" muted> <source src="not-important" type="video/mp4"/> </video> </body> <script> setTimeout(() => { document.body.querySelector("video").play(); }, 1000); </script></html>小提琴： https: //jsfiddle.net/6c7yjg8a/任何想法 ？
播放未加載的視頻時，視頻海報在 Chrome 中會被拉伸
蕭十郎
2023-09-21 17:31:59
