こんにちは。いよいよ最後になりました。前回作った部分をレスポンシブにします。 〜目次〜 外枠の調整 各セクションの調整 完成コードの確認 まとめ 最後に 外枠の調整 まずは外枠です。ここはちょっと特殊で、デバイス幅に依ら…

だんだんページが出来てきましたね。前回トップの画像エリアのPC版が完成しました。続けてSP版を作っていきましょう。以下の画像のデザインです。 〜目次〜 文字の調整 外枠の調整 完成コードの確認 文字の調整 文字の調整をし…

それでは、前回まででheaderが完成したので今回からトップの画像エリアを作ります。以下の画像のエリアです。 〜目次〜 外枠、背景画像の作成 キャッチコピー文字の作成 完成コードの確認 外枠、背景画像の作成 外枠、背景画…

こんにちは。前回に続いてsp版を作ります。前提として、タブレット用のデザインがない場合を想定します。実際の案件でタブレットのデザインまで用意されている場合が経験上ほとんどなかったので。なので、ブレイクポイント（PC版とS…

こんにちは。前回に続いて、header部分を作っていきます。以下の画像の部分です。PC版を作ってからレスポンシブにしていきます。 〜目次〜 外枠の作成 ロゴ、リンクの作成 完成コードの確認 外枠の作成 まずは一番外側の要…

こんにちは。web制作に関する情報って、調べるといくらでも出ては来ますよね。margin/paddingの扱い方、flexboxの仕様、要素の中央ぞろえetc…でも、そういう記事読んでも実際の場面でどう使うか…