Caution

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

CSSプロパティ辞典

トップページ
CSSプロパティ辞典
【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系標準ブラウザ

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

トップページへ