:invalid - HTML CSS CSS Selector

HTML CSS examples for CSS Selector:invalid

  1. HOME
  2. HTML CSS
  3. CSS Selector
  4. invalid

Description

The :invalid selector selects invalid form elements.

The invalid form elements includes input elements with min and max value out of range, email fields without a legal email, or number fields without a numeric value, etc.

Example

Select only if the value of the <input> element is invalid:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
input:invalid {<!--from  w w  w. j a v a 2s.  com-->
    border: 2px solid red;
}
</style>
</head>
<body>

<input type="email" value="an Email address">

<p>Try typing a legal e-mail address.</p>

</body>
</html>

Related Tutorials