#71日目　TechAcademy「はじめての副業コース」

2023年5月23日 17:50

提出したい最終課題

昨日の続きですが、すでにHTML,CSS,JavaScriptは出来上がっているところに、文章内容だけが異なる小セクションを二つ加えるだけで完成しそうです。

HTMLの小セクションをコピー＆ペーストし、文章のみ書き換えました。

そして、再実行すると予定通りの表示ができました😁

もう一つの小セクションも同様に行い、この質問部分は完成しました。

そして、いよいよフッターまで来ました！

フッターを見てみると、ヘッダーのハンバーガーメニューで使用した「SNSのアイコン４つ（インスタグラム、YouTube、フェイスブック、ツイッター）」が横並びになっています。

背景の色のみ違うので、それはCSSのbackground-colorを変更すれば良さそうです。

⇒うまくいきました😊

その下には、ヘッダーで使用した文字列があったので、これもヘッダーをコピー＆ペーストで一部修正し活用しました。

一番下には、新しい小さな文字列でしたので、これは新たにコーディングしました。

これでスマホ版は完成です！

と思いながら、念のため画面の幅を少しずつ広げていってみると、疑似要素「::before」「::after」を使用して描写した線のうち、「::before」の線がズレていきます。

これもいろいろと調べ考えて、解決できました。