Google Mapを埋め込みレスポンシブ対応にする簡単な方法

2018.12.29

Google Mapを埋め込ん無方法、およびレスポンシブ対応にする簡単な方法を見つけたのでご紹介していきます! まず、Google Mapで対象の地図を出します。今回は例として東京駅の地図にしましょう。 Google Map 左メニューの「共有」をクリックします。 googlemap すると、うえのようなポップアップが表示されるので、「地図を埋め込む」をクリックします。 googlemap 「HTML」をコピーするをクリックすると、以下のコードがコピーできます。 googlemap デフォルトで幅が指定されているので、このままだとレスポンシブにはなっていません。レスポンシブにするには、widthを100%にしてあげましょう。 googlemap できた地図が以下です↓ 簡単なので、ぜひ使ってみてくださいね!