ブログを書いていると、記事の内容によっては地図を掲載したい時ってありますよね。ブログに地図を貼る場合に誰もが利用しているのはGoogleマップだと思います。やり方としては、Googleマップを開いて場所を決めたら地図のサイズを調整。あとは発行された埋め込みコードをブログに貼り付けるみたいな...。発行されるhtmlコードはiframeタグ。これってレスポンシブ対応してないから面倒なんですよね(汗)サイズがデカいとブログからはみ出るし、小さいとPC画面では非常に見づらい!そんな訳で、Googleマップの埋め込みコードをレスポンシブ対応する方法について調べてみたところ、超簡単でした。iframeタグのサイズ調整も不要になり、とても便利だと思ったのでご紹介したいと思います(^^)コピペで超簡単!Googleマップの地図をレスポンシブ対応する方法Googleマップの地図をレスポンシブ対応させるにはCSSのコーディングが必要なのだけれど、1回だけスタイルシートに記述しておけば後は楽ちんというわけです。コピペでそのまま使えるようにコードを書いておきます。100%;}なお、詳しい説明をお知りになりたい方は僕が参考にさせてもらった下記のサイトをご覧下さい。WEBDESIGNDAYスポンサードリンクGoogleマップをレスポンシブ対応させた後のデモはこちらGoogleマップが無事にレスポンシブ対応したかどうか、東京ディズニーランドの地図を実際に埋め込んでみます。横幅300px&縦幅250pxのサイズで貼ったのが下の地図。サイズをレスポンシブ対応にしたのが下の地図になります。スマホで見ると違いが分かりにくいので、画面を横向きにしてみて下さい。画面サイズに応じて地図の大きさが可変していますね(^^)この記事、おもしろかったわ。他の似た記事ないわよねぇ...あるよ。(田中要次風)下の「検索」ボタン押してみてや。頻繁にGoogleマップを記事に埋め込んでいるブロガーさんにはとても便利でおすすめだと思いますよ!スマホを使ったFC2ブログの書き方、アプリの「地図を挿入」機能とはスマホでブログを書くときは専ら、FC2さんの旧ブログアプリを普段使いしているFC2ブロガーのMです。いつものように新規投稿の画面を開いて記事の作成に取りかかろうとしたところ、気になるものを発見しまして...。何と!!画面左下のほうに、「地図を挿入」する機能があるじゃないですか!(゚o゚;;何を今さら!なんて思わないで下さいね。ボク自身、ずっと長い間にわたってこのスマホアプリを使ってきたというのに、今までまったく気付...yularihappysmile.comこの記事、おもしろかったわ。ブログ、グルメ、雑学、簡単レシピ、将棋、Kindle、エッセイ、芸能・話題のニュースなど自分が興味のある様々なジャンルについて書いているブログです。マスコミ関係者さまへ取材等のご依頼は下記「お問い合わせ」フォームよりお願いいたします。んでる場所、職業を教えてください。ハンドルネーム:Mこと、タキタノブシゲと申します。東京都在住で、職業は、主に会社経営や投資、ブロガーをしています。