CSS のセレクター

HTML のタグ名で指定します.
p {
color: blue;
}
クラスセレクター
クラス名の前に . をつけます。

.red-text {
color: red;
}
クラス名 red-text を持つ文字は赤色になります

IDセレクター
ID名の前に # をつけます。

#title {
font-size: 24px;
font-weight: bold;
}
ID が title の要素を大きく太字にします。

グループセレクター
カンマ（,）でまとめます。

h1, h2, h3 {
color: green;
}
ユニバーサルセレクター

• を使います.

• {
  margin: 0;
  padding: 0;
  }

---

hover
マウスを重ねたときのデザイン。

button:hover {
background-color: orange;
}
ボタンにマウスを置いたらオレンジ色に変わります。
before
要素の前に内容を追加します。

h1::before {
content: "★ ";
color: gold;
}

after
要素の後に内容を追加します。

h1::after {
content: " ✅";
color: green;
}