Pseudoclase placeholder-shown

La pseudoclase placeholder-shown define el estilo de un input o textarea que muestra el llamado texto de sugerencia, que desaparece después de comenzar a introducir texto.

Sintaxis

cssselector:placeholder-shown {}

Ejemplo

Vamos a establecer un borde rojo para el input que muestra el texto de sugerencia, y después de introducir texto, que el borde cambie a verde:

html<form>
  <input placeholder="enter the text">
</form>
cssinput {
  border: 1px solid green;
}
input:placeholder-shown {
  border-color: red;
}

Результат:

Véase también

  • el atributo placeholder,
    que define la sugerencia para el campo de entrada
  • el pseudoelemento placeholder,
    que define los estilos para la sugerencia