HTMLのdivタグについて

Question

HTMLに関しての質問です。
最近プログラミングを学習し始めた初心者です。

divタグについてなのですが、学習している感じかなり使うように感じています。
ゴチャゴチャしていてややこしく、苦戦しています。
グループ分け等、いろいろ効果はあるのは承知してはいるんですが。
例えばこれですが、

<div class="container"> <div class="row"> <div class="col"> 1 of 2 </div> <div class="col"> 2 of 2 </div> </div> <div class="row"> <div class="col"> 1 of 3 </div> <div class="col"> 2 of 3 </div> <div class="col"> 3 of 3 </div> </div> </div>、

大体がdivがついていて頭が混雑しています。

divタグに慣れるにはどうすべきでしょうか？

Comments

[m.ts10806]

自身が調べたこと試したことを記載してください。
言及している記事が世界のどこにも存在しないとは思えなく（teratailの過去質問含めて）、自身が理解していることは書かれたほうがアドバイスもしやすくなります。
あと、タイトル。 duv じゃないです。

[m.ts10806]

正直現状だと「CSS次第でどんなタグもどんな表現もできる」としか言いようがないです。「プロジェクトのルールや作る人が決めること」レベルです。

[m.ts10806]

コードやエラーはマークダウンのcode機能を利用してご提示ください。
https://teratail.com/questions/238564

Answer 1

divタグについてなのですが、学習している感じかなり使うように感じています。

おそらく、Bootstrapなど、何かしらのCSSライブラリを前提とした書き方のように見受けられます。

<div>やclass単体では意味をなしませんので、組み合わせるCSSやJavaScriptの方から考えてみましょう。

Comments

[sss_1120]

ありがとうございます、助かりました。

Answer 2

divがどうという考え方をしているからだと思います。
確かにタグにはそれぞれ役割がありますが（MDNなどで確認すること）、レイアウトの調整を担当するのは結局CSSです。

「どういうレイアウトか」を見るのはCSSでどういう指定がされているか（及び初期値がどうなっているか）を確認してください。

どんな熟練者であっても、HTMLだけを見たとしてもそれがどういうレイアウトになっているかは分かりません。CSSクラス名から何となく想像できるものもありますが、それはきちんとネーミングルールと機能の整合性が取れているケースに限りますし、結局CSSでどういう指定がされているか見ないと分からないのです。

なので、

divタグに慣れるにはどうすべきでしょうか？

divタグではなく、CSSを見てください（慣れてください）

というのが答えとなります。

Comments

[sss_1120]

なるほど、結局のところはCSS次第ということですね。
ご丁寧にありがとうございました、為になりました。