CSS4の話をする前にHTML5の話から。タグは入力欄を表示するタグです。いってどのような値を入力できるか指定できる属性をつける事ができます。送信ボタンというように決められます。して設定できるようになりました。:invalidを区別するセレクタです。合致しているかどうかはブラウザが勝手に判断します。して正しいか、Eメールアドレスとして正しいか、数値として正しいか等ですね。フォームを表示してみました。お使いのブラウザでは赤、青に分かれて見えるでしょうか。電話番号:Eメール:URL:数値:範囲:色:入力欄は値を変更可能ですので、どのような値がOKで何がダメなのか実際変更して色の変化を見てみてください。電話番号なんかはまだどんな値を入れても「合致している」と判断するようです。前後にアルファベットが必要。必要など判断基準があるようです。こんな感じの入力欄になります。ブラウザによってはカラーパレットが開きます。以上FireFoxGoogleChromeOperaSafariとCSS4のセレクタになりますが、ほぼ全てのブラウザで使用可能となってます。CSS4のものと知らずに、もしかしたらもう既に使っている人もいるかもしれないですね。実際に合ってるかどうかの判断はブラウザに任せずやるべきですが、装飾的な意味で使うのはありかもしれないです。「合致」の判断は変更の可能性あり。