💡 記事の下にエディタを用意しています。壊してもOK！
更新日: 2025年3月1日
CSSでクラスにスタイルを当てる方法｜class指定
📌
結論
.クラス名 で複数要素に同じスタイルを当てられます
📝 実際のコードはこちら
<p class="highlight">テキスト</p>
<style>.highlight { background-color: yellow; }</style>クラスとIDの違い
| セレクタ | 書き方 | 特徴 |
|---|---|---|
| クラス | .highlight | 複数要素に使える |
| ID | #main | 1ページに1つだけ |
まとめ
・スタイルはクラス（.名前）で当てる
・IDはJavaScript用に使う
・1つの要素に複数クラスを付けられる
演習で試してみよう
.highlightクラスで背景を黄色にしてみましょう。🧪 ここで試せます ─ 壊しても大丈夫！
下のエディタで実際にコードを書いて、すぐにプレビューで確認できます。何度でもやり直せるので、思い切って色々試してみてください。
■ 演習
.highlightクラスを作り、背景色を黄色にしてください。そのクラスをpタグに付ける。
詰まったらヒント
.highlight { background-color: yellow; }