今はスマホでHP観る事が殆どなので、殆どのページがフレームワークやライブラリーを使って作成されています
基本的なHTMLとCSSの仕組みを覚えた上でライブラリーの動作を理解して欲しいので出来る限り簡単に説明します
HTMLとCSSだけで作ったページがどんな物かというとこういうページです
阿部寛のホームページ
<h1>はタイトル<p>は段落という文章の意味をタグを使って表すのがHTMLです
タイトルの文字は大きすぎるしテーブルは２重線という今はあまり見ないデザインですが、何も装飾しなければこのような表示です
タイトルの文字をもう少し小さくしたいとか表示を変えたい場合にはCSSを使います
90年代のHPでは
<h1 style="font-size:12px">タイトル</h1>
のようにタグの中に直接CSSを記載していましたが、現在は
<h1 id="top" class="title">タイトル</h1>
の様にidかclassを付けてCSS側で
#top:{font-size:12px;}
.title:{font-size:12px;}
の様に指定します
何故今は使わない方も説明したかというと、ライブラリー等でjsで追加された内容はstyleタグに追加される事が多いので、直接書く事は無くても要素を調べた場合には頻繁に目にします
上記でidにtopという名前を指定しましたが、ページ内で同じid名を別のタグに付ける事は出来ません
逆にtitleという名前のclassは幾つ作っても良いので12pxの文字を何ヶ所も同時に指定出来るし、全部13pxにしたい時も１箇所変えれば良いので簡単です
極端な話CSSの指定については殆どclassで良いです
ただCSSについては優先順位が有って
#top:{font-size:12px;}
.title:{font-size:13px;}
と記載した場合はidの方が優先されて12pxで表示されます
タグ内のstyle要素に記載されている場合はCSS記載より優先されるので
style記載>id要素>class要素
となります
簡潔に説明しましたが、慣れてからで良いので優先度についてはこちらで確認してください
mdn詳細度
プログラムを組むにあたってHTML,CSS,JSに関しては他のサイトで簡単に説明していても情報が古い又は間違っている場合が有るので必ずmdnで確認してください
表現は専門的で分かりにくいかもしれませんが、現段階ではmdnに添った記述を心がけて貰いたいです
どこかの解説ページに記載されていたとしてもmarqueeの様にmdnで非推奨と記載されているタグは使用してはいけません
Mozilla Developer Networkなので一般的にモジラと呼ばれています