【サイト制作】レスポンシブ対応する【2カラム】 プログラミングPhoto by Laura Chouette on Unsplash Twitter Facebook はてブ Pocket LINE コピー 2021.08.23 2020.08.22 シュテル(@sterchannel2020)です! 完成した2カラムページをスマホでもきれいに見えるようにしたい… 2カラムページの「レスポンシブ対応」にトライします👍 目次 2カラムをレスポンシブ対応する流れ無事コンテンツを縦並びにできました!ブレークポイントは450~760pxに設定 2カラムをレスポンシブ対応する流れ #HTMLCSSとWebデザイン入門講座◎2カラムページのレスポンシブ対応・上部のナビはTOPページでの修整を反映・メインエリアとサイドバーをflex-direction: column;で縦並びに、width: 100%;でそれぞれ横幅いっぱいに・各項目が見やすくなるよう調整(margin,width,height,font-size,padding)— しゅてる@暗躍する人事 (@sterchannel2020) August 19, 2020 無事コンテンツを縦並びにできました! ブレークポイントは450~760pxに設定 #HTMLCSSとWebデザイン入門講座◎ブレークポイント・メディアクエリー @media(max-width:###px😉 で設定したpx(スタイルが切り替わる画面幅のこと)・iPad Proが834px、iPhone6~8が375px・小さい画面サイズとして450px、大きい画面サイズとして760pxあたりを起点とすることが多い— しゅてる@暗躍する人事 (@sterchannel2020) August 19, 2020 1冊ですべて身につくHTML & CSSとWebデザイン入門講座 [ Mana ] created by Rinker Amazon 楽天市場 Yahooショッピング