[解決済み】CSSでlabel for="XYZ "を選択する方法は？

質問

HTMLです。

<label for="email">{t _your_email}:</label>

CSSです。

label {
  display: block;
  width: 156px;
  cursor: pointer;
  padding-right: 6px;
  padding-bottom: 1px;
}

を元にラベルを選択したい。 'for' 属性を使用して、レイアウトを変更することができます。

解決方法は？

セレクタは次のようになります。 label[for=email] というように、CSSでは

label[for=email]
{
    /* ...definitions here... */
}

...またはDOMを使用したJavaScriptで。

var element = document.querySelector("label[for=email]");

...または、jQueryを使用してJavaScriptで。

var element = $("label[for=email]");

それは 属性セレクタ . ブラウザによっては（例えばIE < 8のバージョン）属性セレクタをサポートしていない場合がありますが、最近のブラウザはサポートしています。IE6やIE7のような古いブラウザをサポートするには、悲しいかな、クラス（まあ、他の構造的な方法）を使用する必要があります。

(想定しているのは、テンプレート {t _your_email} でフィールドを埋めることになります。 id="email" . そうでない場合は、代わりにクラスを使用します)。

もし、選択する属性の値が CSS識別子 (例えば、空白や括弧がある場合、数字で始まる場合など)、値を引用符で囲む必要があります。

label[for="field[]"]
{
    /* ...definitions here... */
}

彼らは はシングルクォートでもダブルクォートでもかまいません .