CSS リファレンスマニュアル

CSS @ルール(RULES)

CSS 属性完全指南

CSS3 :enabled セレクタ

CSSの派生クラス :enabled は、何かがアクティブ（選択、クリック、テキストの入力を受け付けられる）またはフォーカスを受け取れる要素を示します。要素には、アクティブでない状態（disabled state）もあります。この状態では、要素はアクティブまたはフォーカスを受け取れません。

完全なCSS選択子リファレンスマニュアル

オンラインサンプル

設定所有type="text"のenabledの入力フィールドの文字色：

例

!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8">　
<title>基本チュートリアル(oldtoolbag.com)</title>　
<style>
input:enabled　{
　　color:　#22AA22;
}
input:disabled　{
　　color:　#D9D9D9;
}
</style>
</head>
<body>
<form　action="url_of_form">
　　　　　　<label　for="FirstField">第一个字段(enabled):</label>　<input　type="text"　id="FirstField"　value="Lorem"><br　/>
　　　　　　<label　for="SecondField">第二个字段(disabled):</label>　<input　type="text"　id="SecondField"　value="Ipsum"　disabled="disabled"><br　/>
　　　　　　<input　type="submit"　value="Submit"　/>
　　　　</form>
</body>
</html>

テストを見てみる ‹/›

定義と使用法

:enabled 選択子は、すべての有効な要素（主にフォーム要素）をマッチングします（）。

ブラウザの互換性

テーブルの数字は、その属性をサポートする最初のブラウザバージョン番号を示します。

選択子
:enabled	4.0	9.0	3.5	3.2	9.6

オンラインサンプル

すべての有効な入力要素に背景色を設定する：

例

!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8">　
<title>基本チュートリアル(oldtoolbag.com)</title>　
<style>　
input:enabled
{
　　　　background:#ffff00;
}
input:disabled
{
　　　　background:#dddddd;
}
</style>
</head>
<body>
<form　action="">
名:　<input　type="text"　value="Mickey"　/><br>
姓:　<input　type="text"　value="Mouse"　/><br>
国:　<input　type="text"　disabled="disabled"　value="Disneyland"　/><br>
パスワード:　<input　type="password"　name="password"　/>
<input　type="radio"　value="male"　name="gender"　/>　男性<br>
<input　type="radio"　value="female"　name="gender"　/>　女性<br>
<input　type="checkbox"　value="Bike"　/>　I　have　a　bike<br>
<input　type="checkbox"　value="Car"　/>　I　have　a　car　
</form>
</body>
</html>

テストを見てみる ‹/›

完全なCSS選択子リファレンスマニュアル

CSS関数（Functions）CSS選択子全書