Caution

お使いのブラウザはJavaScriptが実行できない状態になっております。
当サイトはWebプログラミングの情報サイトの為、
JavaScriptが実行できない環境では正しいコンテンツが提供出来ません。
JavaScriptが実行可能な状態でご閲覧頂くようお願い申し上げます。

CSSプロパティ辞典

  1. トップページ
  2. CSSプロパティ辞典
  3. 【CSSセレクタ】E:disabled

【CSSセレクタ】E:disabled

セレクタ:disabled』で、disabled状態の要素に適用できます。こちらは一般に『状態擬似クラス』と呼ばれます。IE8以下のブラウザでは動きません。disabled状態とはボタンやテキストエリアなどの入力フィールドにおける入力を不可にする『disabled』属性が記述された要素です。尚、XHTMLの場合は属性の値を省略できないため、『disabled="disabled"』と記述する必要がありますのでご注意下さい。

サンプルコード
<input type="button" value="ここはボタンです。" disabled> <!-- このようにdisabled属性を指定します。 -->
<input type="button" value="ここはボタンです。" disabled="disabled"> <!-- XHTMLでは属性値を省略できないため『disabled="disabled"』と記述する必要があります。 -->
input:disabled { color: white; background-color: gray;} /* disabled状態のinput要素を白字にして背景色をグレーにします。 */
ブラウザでの表示結果
input:disabled { color: white; background-color: gray;} /* disabled状態のinput要素を白字にして背景色をグレーにします。 */

<input type="button" value="ここはボタンです。有効にしてます。">
<input type="button" value="ここはボタンです。無効にしてます。" disabled>
<input type="textarea" value="ここは有効なテキストエリア">
<input type="textarea" value="ここは無効なテキストエリア" disabled>

対応ブラウザ
IE6 IE7 IE8 IE9 IE10 IE11 Safari Chrome Firefox Opera

iPhone Safari Android2系 標準ブラウザ Android4系 標準ブラウザ

記事の間違いや著作権の侵害等ございましたらお手数ですがこちらまでご連絡頂ければ幸いです。