1 
<input class="problem" type="text" value="some text" disabled="disabled">

「テキスト」の色を変更するにはどうすればよいですか？

upd：ChromeとMozillaでのみ機能するCSSによるスタイリング。IE7+を含むすべてのブラウザのサポートが必要です

4

5 に答える 5

3

いくつかのCSSスタイルを適用するだけです。

.problem {
  color : red;
}

このように、通常の入力と無効な入力の両方に2つの異なる色を定義することもできます。

.problem { color : red; }
.problem[disabled] { color : #cfcfcf; }

フィドルの例：http：//jsfiddle.net/dgNZS

古いIEバージョンでは、すでにここで回答されているように、無効になっている入力要素の色を変更することはできませんが、bobinceの回避策に従うことを試みることができます。

于 2012-07-04T11:28:59.610 に答える
1

テキストの色を除き、IEでのみ、すべてのブラウザのすべてのプロパティのテキストボックスの無効化スタイルを変更できます。IEの場合（テキストの色を除くすべてのプロパティ）、doctypeを4.01 strictに設定してから、次のようなコードを使用する必要があります。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">
input[disabled], input[readonly] { 
 background-color: green; 
 border: #3532ff 1px solid; 
 color: #00FF00;
 cursor: default; 
}
</style>
</head>
<body>
<form>
<input class="problem" type="text" value="some text" disabled="disabled">
</form>
</body>
</html>

しかし、Engineerが書いたようにdisabled = "disabled"の代わりにreadonlyを使用すると、これはieでも機能します。

于 2012-07-04T12:00:51.460 に答える
0

それにスタイルを与えるすなわちstyle="color:green"

<input class="problem" type="text" value="some text" disabled="disabled" style="color:green">

または、入力するクラスにこれを含めます。

于 2012-07-04T11:29:51.633 に答える
0

デモ http://jsfiddle.net/ELuXW/1/

API：CSS- http ://api.jquery.com/css/

これは役立つはずです、:)

コード

$('.problem').css('color', 'blue');​
于 2012-07-04T11:29:54.740 に答える
0

クロスブラウザソリューションの場合、の代わりに属性を使用readonlyし、次のスタイルを適用する必要があります。unselectabledisabled

.problem[readonly]{
     color: red;
     /*Preventing selection*/
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     /**/
}​

マークアップ：

<input class="problem" type="text" value="some text" readonly unselectable="on">

デモ

于 2012-07-04T11:42:46.117 に答える