我有一些來自 YouTube 的嵌入在我的網頁上的視頻。問題是我正在使用下面附加的代碼來使其回應（通過引導程式）。它在移動設備和平板電腦上很好，但在臺式機和筆記本電腦上卻非常龐大。當我無法解決問題時，我沒有使用 YouTube 嵌入并切換到 HTML5 視頻標簽。在那，回應問題通過 width:100% 和 height auto 解決，但視頻沒有加載并繼續緩沖。所以，我再次切換到 YouTube 嵌入，以便至少加載視頻，但它不是真正回應（不是在筆記本電腦、臺式機上）。還附上嵌入視頻的網頁的鏈接。
代碼-
<div class="container">
<div class="ratio ratio-16x9">
<iframe src="https://www.youtube.com/embed/kq7CdSf7ocA?rel=0" title="YouTube video
player" frameborder="0" allow="accelerometer; autoplay; clipboard-write;
encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>關聯-
https://www.simplystraight.in/videos.html
https://www.simplystraight.in/ions-and-their-types-with-examples-video.html
https://www.simplystraight.in/chemical-bonding-video.html
uj5u.com熱心網友回復：
您可以嘗試max-width在 iframe 上設定 a 。
-- 視頻未在片段中加載...小提琴
.container {
display: flex;
justify-content: center;
}
iframe {
max-width: 900px;
max-height: 400px;
}<head>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
</head>
<div class="container">
<div class="ratio ratio-16x9">
<iframe src="https://www.youtube.com/embed/kq7CdSf7ocA?rel=0" title="YouTube video
player" frameborder="0" allow="accelerometer; autoplay; clipboard-write;
encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/421765.html
標籤：
上一篇：為什么正文選擇器中的樣式宣告不會覆寫Bootstrap樣式？
下一篇：如何用兩個div制作垂直分屏？