პსევდოკლასი invalid

პსევდოკლასი invalid აყენებს სტილს იმ ინპუტისთვის, რომელშიც არასწორი მნიშვნელობა შევიდა ან მნიშვნელობა, რომელიც არ შეესაბამება მითითებულ ტიპს.

სინტაქსი

cssსელექტორი:invalid {

}

მაგალითი

მოდით, გავაფერადოთ ინპუტის ფონი ვარდისფერად, როდესაც არასწორი მნიშვნელობა შედის და უკან მწვანე ფერში, როდესაც მნიშვნელობამ გაიარა შემოწმება შერჩეული ტიპის შესაბამისად:

html<p>შეიყვანეთ თქვენი ელ. ფოსტა</p>
<p><input type="email"></p>
cssinput:invalid {
  background: #E37D76;
}
input:valid {
  background: #9DDFA4;
}

Результат:

იხილეთ აგრეთვე

  • პსევდოკლასი :valid,
    რომელიც აყენებს სტილს ინპუტს, რომელშიც შეყვანილია სწორი მნიშვნელობა
  • პსევდოკლასი :default,
    რომელიც აყენებს სტილს ელემენტებს ნაგულისხმევად
  • პსევდოკლასი :in-range,
    რომელიც აყენებს სტილს ელემენტებს მითითებული დიაპაზონის მნიშვნელობებით
  • პსევდოკლასი :out-of-range,
    რომელიც აყენებს სტილს ელემენტებს, რომელთა მნიშვნელობები დიაპაზონის ფარგლებს გარეთაა