CSSの:invalidでエラーになった入力欄のスタイルを変える

CSSの疑似クラスセレクター:invalidを使うと、ブラウザによるバリデーションでエラーが検出された<input>や<form>のスタイルを変えることができます。 :invalidの使用例 例1：メアド形式が間違っていると枠線を赤に 例えば、エラーになった<input>の枠線を赤にしてみます。ここではメールアドレス用の入力欄（<input type="email">）を使うことにします。メールアドレスの形式でない文字列を入力すると、ブラウザがエラーを検出してくれます。