記事情報個人

CSS GridとFlexboxを使ってメディアクエリなしでレスポンシブにレイアウトする方法

CSS GridとFlexboxを使ってメディアクエリなしでレスポンシブにレイアウトする方法

レスポンシブなレイアウトにはメディアクエリが欠かせないわけですが、CSS GridやFlexboxを使えばメディアクエリなしでもレスポンシブなレイアウトが可能です。メディアクエリが全くいらなくなるということはないと思いま [...]...

更新日: 2018-02-13
記事の見出し
  • CSS GridとFlexboxを使ってメディアクエリなしでレスポンシブにレイアウトする方法
  • 目次
  • CSS Gridを使ったレスポンシブレイアウト
  • HTML
  • CSS
  • repeat()とminmax()がポイント
  • リアルなコンテンツでレイアウトした例
  • floatとメディアクエリを使う場合
  • CSS
  • Flexboxを使ったレスポンシブレイアウト
  • CSS
  • flex-wrapとflexの指定がポイント
  • さいごにひとこと
  • About the author
  • この記事をシェアする
  • 関連する記事
  • 人気の記事
  • コメントを残す コメントをキャンセル
テックブログ情報
CSS GridとFlexboxを使ってメディアクエリなしでレスポンシブにレイアウトする方法
ブログRriver
ブログ概要「明日のウェブ制作に役立つ情報を」をモットーに記事を書いています。主にウェブ制作など、ウェブにまつわる情報について、自分が困ったことや悩んだことを調査してまとめています。