目次
class （クラス）とは
クラスは「複数のものに同じスタイルを適用したいとき」に使います
class の使い方はこちらから→HTMLのclassの使い方！を分かりやすく解説！
たとえば、ボタンが６つあります。
赤いボタン３つと緑のボタン３つに分けます。この場合、複数のものに同じスタイルを適用したい時にあたるので、classを使います。
赤いボタンにはclass名に ” red-btn “
緑のボタンにはclass名に ” green-btn “ というふうに、class名に色を入れてあげると分かりやすくなります。
では、このような場合はどうでしょう？
赤いボタンは複数あるのでclassを使うのは分かると思います。
黄のボタンと緑のボタンはそれぞれ１つですが、この場合もclassを使います。
「複数のものに同じスタイルを適用したい時」この同じスタイルを指すのはボタンであって、色ではありません。
なので、
赤いボタンにはclass名に ” red-btn “
黄のボタンにはclass名に ” yello-btn “
緑のボタンにはclass名に ” green-btn “ として区別をしてあげます。
idとは
id ( ID) とは、「一つだけの特別なものにスタイルを適用したいとき」に使います
id を使う場合はこのように特別なボタンになります！他とはちょっと違ったスペシャルなボタンに id を使います。
id=” special-btn ”
どっちを使えばいいの？
・複数のものに同じスタイルをつけたい→class（クラス）を使う！
・１つだけの特別なものに適用したい→ id（ID）を使う！
基本的にはクラスを使い、id は本当に特別の場合にだけ使うのがおすすめです！
コメント