半歩ずつでも前に進めば変わっていく

Kozue Blog

プログラミング 学習 記録

プログラミングで月収5万円になるまでの記録23日目

更新日:

こんにちは、こずえです。
プログラミング学習記録23日目です。
サイトの模写をしていく上で骨組みを視覚化するためにcontainer、row、colの配置図を作成しました。

所感:自分の完璧主義の面と闘っています。完璧主義を克服したい。

合計学習時間

前回までの時間:34.00[h]
今回の時間:2.25[h]
合計時間:36.25[h]

学習内容

はじめに模写するのは以下のサイトにします。

こちらのサイトの横幅を縮めて確認したところ、ブレイクポイントはwidth:743でした。
HTMLを記述していく前にcontainer、row、colの配置を視覚化しておきたいと思ったので、Adobe Comp CCで図作成してみました。
一旦以下のように分割して作成していこうと思います。

ナビゲーションバー

Bootstrapのnavbarで作れる?

バツ印で消える部分

バツ印を押すと消えます。
どう実現するのかイメージがつかないのでここは後回しにしたいと思います。

メイン1

一つ目のrowの文字はh1と予想。

メイン2

1つ目のrowの文字はh2、3つ目のrowの文字h3と予想。

メイン3

2つ目のrowの文字はh2と予想。

フッター

図を作成する際にfontサイズも並行して見ていたのですが思っていたよりも時間が掛かってしまいました…。
まずは骨組みの部分をと思っていたのでfontサイズは後回しでもよかったかもしれませんね。

次回はこの枠を元にHTMLを書いていきたいと思います。

-プログラミング, 学習, 記録
-, , ,

Copyright© Kozue Blog , 2019 All Rights Reserved Powered by STINGER.