新しいGoogleマップをレスポンシブ対応で埋め込む方法 | ライフハッカー・ジャパン
Digital Inspiration：新しくなったGoogleマップでは、ウェブページに地図を埋め込むことが可能となりました。Googleマップのサイトを開き、埋め込みたいエリアをズームインします。右下の歯車アイコンをクリックして、メニューから「地図を埋め込む」オプションを選択すれば、埋め込みコードを取得できます。 埋め込みコードを使ったサンプルページがこちらです。デフォルトでは、Googleマップがレスポンシブに対応していません。スマートフォンなどでページを開くと、地図のサイズがデバイス画面にフィットせず、はみ出してしまいます。 同じGoogleマップをレスポンシブ対応で埋め込んだサンプルがこちら。ブラウザをリサイズしたり、スマートフォンからページを開いても、画面に合わせて地図のサイズを自動調整してくれます。 Googleマップをレスポンシブに埋め込む方法 以下がGoogleマップのデ
指定したウェブサイトで使われている配色・フォントを抽出してくれるサイト「Stylify Me」 | ライフハッカー・ジャパン
「Stylify Me」は指定したウェブサイトで使われている配色を抽出してくれるサイトです。ウェブサイトではさまざまな色が使われていますが、その色を抽出して一覧にしてくれます。「このサイトの配色を参考にしたいな」といったときに便利です。配色に加え、使われているフォントの種類も教えてくれますよ。 以下に使ってみた様子を載せておきます。まずStylify Meへアクセスしましょう。配色を知りたいウェブサイトのURLを入力して「Stylify Me」ボタンを押します。 するとこのように使われている配色の一覧が表示されます。ライフハッカーで使われている色は少なくシンプルですね。 さらに使われているフォントの一覧も作ってくれますよ。お気に入りのサイトの配色やフォント情報がまとめて手に入るので便利ですね。この結果をPDFで出力することも可能です。ぜひウェブサイトのデザインを考える際にご活用ください。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
