Bootstrap4を使えば、レスポンシブなYouTubeリンクを貼り付けることができます。レスポンシブというのがミソです。
普通にYouTubeリンクを貼ると、固定サイズになってしまいますからね。Bootstrap4を使えば、クラスを追加するだけでレスポンシブなYouTubeリンクの出来上がりです。
もちろんYouTubeだけでなく、普通の動画でもOKです。
Bootstrap4 YouTubeをレスポンシブで貼り付ける（HTML）
<div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" src="https://www.youtube.com/embed/JYzTYXD6fGU" allowfullscreen></iframe> </div>
「div」に「embed-responsive」と「embed-responsive-16by9」を追加します。「16by9」は動画の比率を表しています。
- embed-responsive-21by9
- embed-responsive-16by9
- embed-responsive-4by3
- embed-responsive-1by1
動画を設定する「iframe」には「embed-responsive-item」を設定すれば完成です！