CSS :invalid 疑似クラス| CSS:スタイルシート 関数 要素 使い方・書き方 例 CSS サンプル

:invalid 疑似クラス CSS プロパティとは

トピック：要素の設定に従って検証されない値を持つフォーム要素を選択する事ができる 内容の検証に失敗した<input>要素または<form>要素を表す

疑似クラス セレクター :invalid

実例 コード 1

サンプル コードを試す
    input:invalid { 
         border: 2px solid pink;
    }
    /* 無効な <input> を選択 */
    使用上の注意：:invalid セレクタは、最小および最大の属性を持つ入力要素、正しい電子メールのない電子メールフィールド、数値のない数字フィールドなど、制限のあるフォーム要素でのみ機能する ことができる。
    トピック：
  • :validセレクタを使用して、要素の設定に従って検証する値を持つフォーム要素を選択する ことができる。

構文

:invalid { css : properties ; }
 疑似クラス名 {スタイル要素のプロパティ : プロパティ値; }
CSS バージョンCSS 3

サポートするデスクトップ ブラウザ対応・互換性

PropertyDesktop 互換性
:invalidChromeEdgeFirefoxInternet ExplorerOperaSafari
基本 サポートフルサポート◯10フルサポート◯12フルサポート◯4フルサポート◯10フルサポート◯10フルサポート◯5
<form> 要素に適用フルサポート◯ありサポートなし✖フルサポート◯13サポートなし✖フルサポート◯あり 不明

サポートするモバイル ブラウザ対応・互換性

PropertyMobile 互換性
:invalidAndroidChrome for Android
Edge MobileFirefox for Android
Opera for Android
iOS SafariSamsung Internet
基本 サポート 不明 不明フルサポート◯ありフルサポート◯4フルサポート◯10フルサポート◯5 不明
<form> 要素に適用 不明 不明サポートなし✖フルサポート◯14 不明 不明 不明
：:invalid 疑似クラス 関連記事
CSS :invalid 疑似クラス| CSS:スタイルシート 関数 要素 使い方・書き方 例 CSS サンプル
CSS :invalid 疑似クラス | CSS プロパティ 値| 意味 使い方 実例 – WebRef
あわせて読みたい

Html

Glossary

PHP

JavaScript

JQuery

CSS