これまでに「ヘッダー」「About」「Works」「Blog」「Contact」という5つの部分デザインが完了しました。
今回は、最後の部分となりそうな、フッター部分のデザインをしていきます。
しかし今回のデザインは、フッター部分よりもこれまでに作っていたBlog部分の変更がメインになってしまいました。
フッター部分の作成
1. フッターを作ります。
![](https://konsuki.com/wp-content/uploads/2021/03/image-441-1024x605.png)
フッターに入れた文字はコピーライトだけです。
少し見づらいですが、水平方向に一本線も書かれています。
![](https://konsuki.com/wp-content/uploads/2021/03/image-442-1024x623.png)
線をつけることで、後からヘッダーにリンクなどを含めたときに、コピーライトとの見分けがつきやすくなるようにということと、この線がない場合フッターが細すぎる印象だったということがこの線をつけた理由です。
2. キャンバスの高さを変更します。
![](https://konsuki.com/wp-content/uploads/2021/03/image-445-1024x775.png)
フッターより下に要素を作る必要がなくなったため、キャンバスの高さを変更します。
ヘッダーの上側からフッターの下側までがキャンバスになるように高さを変更します。
![](https://konsuki.com/wp-content/uploads/2021/03/image-446-1024x607.png)
![](https://konsuki.com/wp-content/uploads/2021/03/image-447-1024x773.png)
Blog部分の変更
Blog部分のデザインを次のように変更しました。
変更前
![](https://konsuki.com/wp-content/uploads/2021/03/image-444-1024x943.png)
変更後
![](https://konsuki.com/wp-content/uploads/2021/03/image-443-1024x820.png)
終わりに
今回までで出来上がった全体像は次のようになります。
![](https://konsuki.com/wp-content/uploads/2021/03/image-450.png)
コメント