tienda - ¿Cómo seleccionar la etiqueta para="correo electrónico" en CSS?

modificar css

Question

HTML:

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

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 ancho.

Answer 1

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 admitir navegadores más antiguos como IE6 e IE7, tendrías que usar una clase (bueno, o alguna otra forma estructural), por desgracia.

(Supongo que la plantilla {t _your_email} rellenará 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 de un identificador de CSS (por ejemplo, si tiene espacios o corchetes, o comienza con un dígito, etc.), necesita comillas alrededor del valor:

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

Pueden ser comillas simples o dobles .