特異性とは?同じ要素を指すCSSルールが2つ以上ある場合、特定性の値が最も高いセレクターが「優先」され、そのスタイル宣言がそのHTML要素に適用されます。特異性は、要素に最終的に適用されるスタイル宣言を決定するスコア/ランクと考えてください。次の例を見てください。例1この例では、「p」要素をセレクターとして使用し、この要素に赤色を指定しました。テキストは赤になります。次に、例2を見てください。例2この例では、クラスセレクター("test"という名前)を追加し、このクラスに緑色を指定しました。(要素セレクター"p"に赤色を指定しましたが)。これは、クラスセレクタ-の優先度が高いためです。次に、例3を見てください。idセレクターの優先度が高いため、テキストは青色になります。次に、例4を見てください。例4この例では、「p」要素にインラインスタイルを追加しました。インラインスタイルが最優先されるため、テキストはピンク色になります。特異性の階層すべてのCSSセレクターは、特異性階層にその場所があります。セレクターの特異性レベルを定義する4つのカテゴリーがあります。::before特異度の計算方法は?特異度の計算方法を覚えよう!0から開始し、ID値ごとに100を追加し、クラス値(または疑似クラスまたは属性セレクター)ごとに10を追加し、要素セレクターまたは疑似要素ごとに1を追加します。注意:インラインスタイルの特異度は1000で、常に最優先されます。注意2:このルールには例外が1つあります。!importantルールを使用すると、インラインスタイルもオーバーライドされます。以下の表は、特異度の値を計算する方法の例をいくつか示しています。つのコード部分を考えてみましょう。要素セレクター1つ)、Cの特異性は1000(インラインスタイル)3番目のルール(C)の特異度値が最も高い(1000)ため、このスタイル宣言が適用されます。同じルールが外部スタイルシートに2回書き込まれた場合、最新のルールが優先されます。次の3つのコードを見てください。blue;}[自分で試してみる»]https://techis.jp/guide/tryit/549){.techis-btn}最初のルールは他の2つよりも詳細性が高いため、適用されます。-埋め込まれたスタイルシートは、スタイル設定される要素で最も優先されます。</style>後者のルールが適用されます。クラスセレクターは、任意の数の要素セレクターに勝ります。ユニバーサルセレクター(*)と継承された値は無視されます。>実績多数!おすすめのプログラミングスクール9選プログラミング学習を加速させるプログラミングをプロの講師に教えてもらいませんか。テックアイエスのプログラミングスクールは初心者も大歓迎です。年齢制限もありません。テーブルCSSのdisplayの使い方を完全解説!block・inlineの違いについても解説します。演習テックアイエスガイドは、プログラミン学習者向けに多くの言語の情報を配信しています。