たった1行追加するだけでYouTubeの埋め込み動画をレスポンシブに対応させる方法 | TechMemo
Tweet ブログに YouTube の動画を埋め込んでいる人は多いと思います。また、最近ではサイトにレスポンシブデザインを採用している人も多いと思います。WordPress でもレスポンシブに対応したテーマが多くリリースされていますね。 レスポンシブデザインのブログに YouTube 動画を埋め込むと、スマートフォンでサイトを見た時に動画が画面からはみ出てしまうことがあります。 埋め込みコードを使って YouTube の動画を埋め込んだ場合、iframe を使って動画を表示します。この iframe の幅が 560px などに指定されているためスマートフォンで表示した時に画面からはみ出してしまうのです。 そんな YouTube 動画をレスポンシブに対応させる方法として、div などで動画のコードを囲って CSS クラスを付与して調整する方法がよく紹介されていますが、毎回 HTML ソース
「レスポンシブWebデザインで変わるワークフロー」のプレゼン資料をアップしました
上にスライドが表示されない場合はこちらからご覧ください。 3月9日に行われたSwapSkills Doubbble09 「マルチデバイス時代の新常識 レスポンシブWebデザインの今と未来」という勉強会で「レスポンシブWebデザインで変わるワークフロー」という題名でお話をさせていただきました。プレゼン資料の公開のお許しが出たのでシェアします。プレゼン資料だけだと分かりづらい部分もあるかと思いますが、少しでもなにかのお役に立てば幸いです。 また、関連する内容で、このブログの記事でぜひ読んでいただきたいものをご紹介しておきます： レスポンシブWebの時代だからこそ見直すべき、3つの「ウェブの哲学」 レスポンシブWebデザインは臨機応変に使うのが良い レスポンシブWebデザインのウェブサイトを半年運営してみて思ったこと レスポンシブWebデザインのサイトに「デスクトップ表示」ボタンが必要な2つの理
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
