CSSセレクター

cssセレクター スタイルを選択できるツール。内部コードでも外部参照でも、abc.cssなどのファイルに適しています

1. 基本的なセレクター
   *{ }は、適用を表す単純な*です。パーソナライズされた詳細なページには適していません。副作用は、それが良いか悪いかに関係なく、元のスタイルを上書きすることです。 p には、他のタグ
   
   #123{ } ID セレクター (123css ファイルと同じスタイル など) ID は任意の ID を指定できます文字または数字は一意です。これが標準です。
   .abc{ } タグに class=abc 属性がある場合、これらのタグは同じクラスと呼ばれます。

   
   クラス CSS は複数の場合に便利なスタイルです。 p.abc{ } abc クラス内の p タグが有効になるように制限します

   例:

   html ファイル

   CSS ファイル内のすべての b タグ

   

   

   class=abc 有効になります

   1 つのタグが複数のクラス スタイルを参照し、2 つのクラス スタイルをスペースで区切ります

   

   [href]{ }属性セレクター、中括弧内のすべての属性スコープへのハイパーリンク
   [type=password] { } これはさらなる規定であり、 type 属性のみにすることができ、パスワード タイプに属する場合にのみ CSS を適用します。他のタイプは無効

   [href^=http] 属性が href で値が http で始まる場合は css を適用します

   [href$=.cn] 属性が href で値が .cn で始まる場合は最後に css を適用します

   [href*=baidu] 属性値にはbaiduの文字フラグメントが含まれており、cssを使用して「
   

   htmlファイル

   cssファイル」を曖昧検索します

   効果

   その他のセレクター:

   [class ~=def] 特定の属性の値に複合文字または複数の文字が含まれており、指定された文字に一致するアプリケーションCSS

   

   [lang|= "en" ] 特定の属性の値には区切り記号 - が含まれています。このメソッドはパフォーマンスを節約し、マシンが見つけやすくします

   

   

   複数要素の選択。コンテナーは、共通のタグ、ID、クラスを組み合わせて使用​​できます。



p b{ } Fuzzy あるタグのサブタグをcssアプリケーションオブジェクトとして指定します 指定したサブタグ以外の他の親タグには影響しません



p >b {違いは、p の下に b サブタグを指定していることです。p の下にスパンがあり、span の下に b がある場合、p>b は p>span>b に変更する必要があります



p+b{ } p 要素とその隣の b 要素

p~b{ } p から b までのすべての要素 (p と b を含む)、および 2 点間のすべての要素と一致します

2. 。
   疑似要素セレクター

   ::first-line{ } ブロックレベルの最初の行の適用。ウィンドウの拡張により最初の行の単語数が変更されますが、最初の行には CSS を適用する必要があると規定されています。したがって、ウィンドウがどのようにプルされたとしても、
   赤い単語はウィンドウのサイズが変更されると新しい行に折り返されます。赤色の first-line は HTML の最初の行、または

   の最初の行に有効です。

   p::first-line{ } p の最初の行のみ有効になります。

   

   上の図の下半分が で囲まれた内容です。 .

   

   ::first-letter ブロックレベルの最初の文字に CSS を適用します

   

   

   a::before ラベルの前に指定された文字列を挿入します

   a:: after ラベルの後に指定した文字列を挿入します

   htmlファイル

   

   cssファイル

   

   クリック前

   

   クリック後

   

以上がCSSセレクターの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。