レスポンシブ対応でサイズ変更してくれるクラスが用意されています。ここではGoogleMapを埋め込む方法と、GoogleMapのiframe要素を取得する方法を紹介します。埋め込む方法(レスポンシブ対応)Bootstrap4でGoogleMapを埋め込むには、次のように記述します。</div>これだけでレスポンシブ対応のGoogleMap表示となります。クラスを指定するだけです。アスペクト比とは?アスペクト比とは、矩形の長辺と短辺の比率です。クラスは次の4つです。好みのアスペクト比を指定してください。地図を埋め込む場合は「4:3」か「1:1」が良いと思います。指定した場合、次のように表示されます。指定した場合、次のように表示されます。画像の上に文字を重ねる方法Bootstrap4のcardクラスを使って画像の上に文字を重ねる方法を紹介します。文字を中央に表示するためのカスタマイズ方法も紹介しています。画像スライダー(カルーセル)のサンプルコードBootstrap4に用意されているカルーセル機能を使ったサンプルコードと、コードのカスタマイズ方法、オプションの指定方法等を紹介します。レスポンシブ対応です。