CSS でクラスと ID を使用する場合-CSSチュートリアル-php.cn

CSS でクラスと ID を使用する場合

青灯夜游

リリース： 2023-01-04 09:38:55

オリジナル

3255 人が閲覧しました

CSS スタイルが複数の要素に適用される場合は、class を使用して定義します。CSS スタイルが 1 つの要素のみに適用される場合は、id を使用して定義します。理由: ID は繰り返し使用できず、1 回しか使用できません。1 つの ID は 1 つのラベル要素にのみ使用できます。クラスは繰り返し使用でき、同じクラスを複数のラベル要素に定義できます。

CSS でクラスと ID を使用する場合

このチュートリアルの動作環境: Windows7 システム、css3 バージョン、Dell G3 コンピューター。

チュートリアルの推奨事項: css ビデオチュートリアル

CSS のセレクターに加えて、、

などの HTML 定義済みタグを選択できます。、

。ユーザー定義の ID またはクラスを選択することもできます。 id と class の主な違いは、id は繰り返すことができず、一度しか使用できないこと、1 つの ID は 1 つのラベルに対してのみ使用できることです。クラスは再利用でき、同じクラスを複数のタグに定義できます。実は、idとclassの違いは名前からも分かりますが、idは識別子、classはクラスです。

では、いつ ID を使用し、いつクラスを使用するのでしょうか?

CSS スタイルが複数の要素に使用される場合は、クラスを使用して定義します。
CSS スタイルを 1 つの要素のみに適用する場合は、id を使用して定義します。

たとえば、ナビゲーションバー。各ページにトップナビゲーションバーが 1 つだけある場合は、ID を使用してそれを定義できます。

<nav id="nav"></nav>
// 或者
<div id="nav"></div>

ログイン後にコピー

たとえば、次のようになります。製品リストも同じスタイルです。クラスを使用して

<ul id="list">
    <li class="list-item">1</li>
    <li class="list-item">2</li>
    <li class="list-item">3</li>
</ul>

ログイン後にコピー

以上がCSS でクラスと ID を使用する場合の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。