More than 3 years have passed since last update.

【デイトラ】初級ノートDAY6~DAY7

Last updated at 2020-10-09Posted at 2020-10-09

◆悩んだとこ、後から気づいたとこをシェアしていきます。

デイトラをはじめました。
現在中級に入ったところですが、つまずくようになってきたので
初めて復習をしています。

復習にあたって、VSCodeでmarkdownを使ってノートをとるようにしました。
せっかくなので、同じ悩みの方に向けて投稿していきます。

単元を学習した後に読むのが良いと思います。

わたしも同様に初学者です。内容の正確性を保証することはできません。
訂正やより良い情報があればご教授お願いします。

違い	ブロック	インライン	インラインブロック
改行	要素の前後	入らない	入らない
幅、高さ	指定できる	指定できない	指定できる
margin	上下左右	左右のみ	上下左右
タグ	div,h1,p,ul	a,span,input	button

私は、インラインブロックが何かはわかりましたが、
どう使い分けるのか未だにわかっていません。
しかし、コードを読むために今のうちに特徴はを覚えた方が良いと思います。

今後必ず使いますので、
可能な限り慣れたほうが良いです。

私は、いざ使う時にどの要素に
display: flex
を記述するのかわからなくなりました。

下記にとても良い練習サイトがあります。

max-width = 以下
min-width = 以上
iPadの表示幅は768px

モバイルファーストという記述方法が一般的だそうです。
教材では、PCの表示を作ってからモバイル向けに作っていますが、
まず、モバイル向けに作ってからPC向けに作ることを言うそうです。

メリットは、スマートフォンで見られる可能性がとても高いということ。
そして、スマートフォンで見る場合にPC用の不要なデータまで通信することで、
表示が重くなってしまう可能性があるということです。

個人的なメリットですが、
レスポンシブの記述をする時にどうしても尻込みしていたのが、
軽減されたと思います。

私は、復習する際にモバイル向けに作ってから、
教材のようにPC向けに作るようにしました。