¿Cómo seleccionar la etiqueta for = “email” en CSS?

HTML:

CSS:

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

Quiero crear un nuevo CSS para la etiqueta de correo electrónico, ya que no debe ser tan amplio.

El selector sería label[for=email] , por lo que en CSS:

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

… o en JavaScript usando el DOM:

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

… o en JavaScript usando jQuery:

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

Es un selector de atributos . Tenga en cuenta que algunos navegadores (versiones de IE <8, por ejemplo) pueden no ser compatibles con los selectores de atributos, pero los más recientes sí. Para soportar navegadores más antiguos como IE6 e IE7, tendría que usar una clase (bueno, o alguna otra forma estructural), tristemente.

(Supongo que la plantilla {t _your_email} completará un campo con id="email" . Si no, use una clase en su lugar).

Tenga en cuenta que si el valor del atributo que está seleccionando no se ajusta a las reglas para un identificador de CSS (por ejemplo, si tiene espacios o corchetes, o comienza con un dígito, etc.), necesita cotizaciones alrededor del valor:

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

Pueden ser comillas simples o dobles .