Javascript
 Computer >> コンピューター >  >> プログラミング >> Javascript

CSSの属性セレクター


特定の属性を持つHTML要素にスタイルを適用することもできます。以下のスタイルルールは、値が textのtype属性を持つすべての入力要素に一致します。 −

input[type = "text"]{
   color: #000000;
}

以下は、属性セレクターに適用されるルールです。

  • p [lang] -lang属性を持つすべての段落要素を選択します。
  • p [lang ="fr"] -lang属性の値が正確に「fr」であるすべての段落要素を選択します。
  • p [lang〜="fr"] -lang属性に「fr」という単語が含まれているすべての段落要素を選択します。
  • p [lang | ="en"] -lang属性に正確に「en」であるか「en-」で始まる値が含まれているすべての段落要素を選択します。

  1. CSS属性セレクターを使用したフォームのスタイリング

    CSSの属性セレクターを使用して、特定の属性を持つHTML要素にスタイルを適用します。属性セレクターには次のルールが適用されます。 p [lang] −lang属性を持つすべての段落要素を選択します。 p [lang =fr] −lang属性の値が正確に「fr」であるすべての段落要素を選択します。 p [lang〜=fr] −lang属性に「fr」という単語が含まれているすべての段落要素を選択します。 p [lang | =en] − lang属性に正確に「en」であるか、「en-」で始まる値が含まれているすべての段落要素を選択します。 以下は、C

  2. CSSの高度なセレクター

    CSSのAdvancedSelectorsには、隣接兄弟セレクター、属性セレクター、直接子セレクター、n番目のタイプセレクターなどが含まれます。また、GeneralSiblingSelectorも含まれます。例を以下に示します。 h1 ~ h3 直接子セレクターの例- div > span 以下は、CSSの高度なセレクターを示すコードです- 例 <html> <head> <style> #red {    color: red; } .green {    background: green; } ul:n