cssセレクタ+css優先度

1799 ワード

1.IDセレクタ#elem{}id="elemコメント:1.IDは一意で、1ページに1回しか現れず、何度も現れるのは仕様に合わない.2.命名された仕様は、アルファベット、下線、中線、アルファベット(そして最初の若くない数字)3.アルパカ表記:search Button(アルパカの峰)Search Button(大きなアルパカの峰)短線表記:search-small-Button下線表記:search_small_butto 2.classセレクタelem{}class="elem"注釈:1.1つのclassセレクタは多重化できます.2.複数のclassスタイルを追加できます.3.複数のスタイルの場合、class属性の順序4ではなくcssによってスタイル優先度が決定する.ラベル+クラスの書き方3.ラベルセレクタdiv{}
シーンを使用:
1.一部のラベルのデフォルトスタイルを削除
2.複雑なセレクタ.階層セレクタなど
4.グループセレクタ(グループセレクタ)
コンマで、複数の異なるセレクタに統一されたcssスタイルを追加して、コードの多重化を達成できます.
5.パスセレクタ
*{}
コメント:
1.すべてのラベルを設定するには、「ワイルド・セレクタ」を使用します.
6.階層セレクタ
子孫セレクタm n{}
親子セレクタm>n{}
兄弟セレクタm~n{}現在Mの下にあるすべての兄弟のnラベル
隣接セレクタm+n{}
7.属性セレクタ
m[attr]{}
=:完全一致
*=:部分一致
^=:開始一致
$=:照合の終了
8.擬似クラスセレクタ
m:ダミークラス{}
:linkアクセス前のスタイル(aラベルにのみ追加できます)
:visitedアクセス後のスタイル(aラベルにのみ追加できます)
:hoverマウスの移動時のスタイル(すべてのラベルに追加可能)
:activeマウスを押したときのスタイル(すべてのラベルに追加可能)
:after,:beforeは偽クラスの方法で要素にテキスト内容を追加し、content属性を使用します.
:checked,:disabled,:focusはフォーム要素の
             
        nth-of-type() nth-child()
            1   ,1.     。2.     
        first-of-type
        last-of-type
        only-of-type

9.css継承文字に関するスタイルは継承レイアウトに関するスタイルは継承できない(デフォルトでは継承できないが、継承属性inheritを設定できる).css優先度1.同じスタイルの優先度同じスタイルを設定場合、後の優先度は高くなりますが、繰り返しスタイルを設定することは推奨されません.内部スタイルと外部スタイルの内部スタイルと外部スタイルの優先度は同じで、同じスタイルを設定場合、後の優先度は高くなりますが、スタイルの繰り返し設定は推奨されません.単一スタイル優先度style行間>id>class>tag(ラベル)>*>継承コメント:重み値:style行間:重み1000 id重み100 class重み10 tag重み4.!importantはスタイルの優先度を向上させ、規範ではなく、使用を推奨せず、継承された属性に対して優先度の向上を行うことができない.ラベル+クラス>単一クラス6.グループ優先度は単一セレクタ優先度と同じであり、下位の優先度が高い.階層優先度1.重み比較ulli.box p input{} 1+1+10+1+1 .hello span #elem{} 10+1+100 2.約分比較ulli.box p input{} li p input{} .hello span #elem{} #elem{}