Comment sélectionner l'étiquette pour = "XYZ" en CSS?
HTML:
<label for="email">{t _your_email}:</label>
CSS:
label {
display: block;
width: 156px;
cursor: pointer;
padding-right: 6px;
padding-bottom: 1px;
}
Je souhaite sélectionner l'étiquette en fonction de l'attribut 'for' pour apporter des modifications à la mise en page.
Le sélecteur serait label[for=email], donc en CSS:
label[for=email]
{
/* ...definitions here... */
}
... ou en JavaScript en utilisant le DOM:
var element = document.querySelector("label[for=email]");
... ou en JavaScript avec jQuery:
var element = $("label[for=email]");
C'est un sélecteur d'attribut . Notez que certains navigateurs (les versions de IE <8, par exemple) peuvent ne pas prendre en charge les sélecteurs d'attributs, mais les plus récents le sont. Pour prendre en charge les navigateurs plus anciens tels que IE6 et IE7, vous devez utiliser une classe (bien, ou d'une autre manière structurelle), malheureusement.
(Je suppose que le modèle {t _your_email} remplira un champ avec id="email". Sinon, utilisez une classe à la place.)
Notez que si la valeur de l'attribut que vous sélectionnez ne correspond pas aux règles d'un identifiant CSS (par exemple, s'il comporte des espaces ou des crochets, ou commence par un chiffre, etc. ), vous avez besoin de guillemets autour de la valeur:
label[for="field[]"]
{
/* ...definitions here... */
}