業務レベルでCSSを使うなら話は別だが、とりあえず自分でHTML+CSS使えるようになれればいい。
という場合掲題の通りHTMLのブロックレベル要素とインライン要素の違い。その後ボックスモデルについて学ぶのが近道だと思う。
自分に教える機会があったらCSSの文法をまず軽く触って(対象セレクタの設定を中括弧の中に書いてプロパティ:値みたいに書いて行末は;みたいな)、その後ブロックレベル要素、インライン要素を知らなければ教える。
その概念が理解できたあとそれはCSSのdisplayプロパティで変更することができて今ではinline-blockという便利なものもあるという感じ。
その後ボックスモデルの説明でwidth,heightプロパティはコンテンツの横幅,高さを指すものではなくてborder,paddingの合計値になるということや、marginとかfloatとかその辺を伝えて、慣れてきたらclearfixみたいな便利なものもあるみたいな話をする。
この順序が必ず正しいってわけではないけど、display:inlineをliに設定するとリストが横並びになるみたいな、なんていうか遠回りな覚え方をしないようにするにはこんな感じがいいのかなと。
レイアウトからCSSに入るとどうしてもそういう覚え方をしてしまいがちだけど(俺がそうだったから)それだと応用が聞かなくてトータルで考えるとコスト増なのでは。
