Pseudo-klassen placeholder-shown

Pseudo-klassen placeholder-shown anger stilen för ett inputfält eller textarea där så kallad hjälptext visas, som försvinner efter att textinmatning påbörjats.

Syntax

cssselektor:placeholder-shown {}

Exempel

Låt oss sätta en röd ram för inputfältet där hjälptexten visas, och efter textinmatning låt ramen ändra färg till grön:

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

Результат:

Se även

  • attributet placeholder,
    som anger hjälptext för inputfältet
  • pseudo-elementet placeholder,
    som anger stilar för hjälptexten