166日目　ポートフォリオサイト　タブ切り替え下地を作る

WEBデザイン日記166日目です！
本日はポートフォリオサイト制作のみ行いました。
ペンタブも設定したかったですが、時間が無くて断念・・・
タブ切り替えで制作物を表示させるようにしたいと思っていて、その下地を作ってみました！

タブ切り替え下地制作

このように項目ごとにタブを表示させ、そのタブタイトルに関連する制作物をそれぞれに表示させようとしています。

時間が無くてまだ、タブ切り替えの動作コーディングは行えていませんが、おおよその下地が出来たのでそれぞれのタブ内容をコードのコピペで作れる準備が出来ました！

この下地に関して、意外と簡単なコード構成でできており、項目がそれぞれリストになっており、フレックスで横並びになっており、その下に制作物を載せる用のエリアをdivで作り、その中にそれぞれaタグで画像を表示させるだけでした。

これをタブがクリックされるとdisplay:none;で不必要な中身を消して、必要な中身の時はdisplay:none;を消すという動作をさせようと思っています！

その他、タブも選択されているものは白く、その他は黒くしようと思っています。

数週間コーディングから離れているだけで・・・

最近、ポートフォリオサイトのデザインに専念しており、コーディングから少し離れていたせいか、コーディングについて「これ、どうやるんだっけ？？」ということが増えてしまい、何事も少し離れると忘れてしまうんだなと感じ、あまり時間を空けないようにしたいなと感じました(>_<)

今回でいうとタブと制作物エリアをdivなり、aなりで表示させるだけなのに少し悩んでしまい少し悔しい思いをしました！

あとがき

---

悩む時間が多く、あまり進みませんでした。
明日の授業最終日までにせめてタブ切り替えやこのnoteへのリンクなどを追加していい感じに調整しようと思っていましたが残念！

もっと時間が欲しいと思うこの頃です（笑）
ペンタブも設定してお絵描きもしたいし、最近はやりたいことが尽きないです！

優先すべきポートフォリオ、やりたいイラスト・・・
葛藤の毎日ですが、焦らずやっていこうと思います！

明日はいよいよ授業の最終日です！
長いようであっという間に過ぎてしまった6か月間。
最初はエディターって何？Photoshopってどうやって使うの？色々難しそうと感じていましたが、今となっては下層ページ、レスポンシブまで対応できるようになっており、勉強を始めたころの自分にしっかりできているよといってあげたいなとしみじみ思います（笑）

noteも授業期間中は毎日発信という自分に課せた課題も明日でようやく完了となり、これからはnoteではなくワードプレスに投稿していこうと思います。頻度も毎日ではなく1記事事制作物を載せながら中途半端な記事ではなくちゃんとした記事を投稿していこうと思います。

こんな感じで今日はここまでです。
明日もしっかり勉強します！