1

PHP で作成された select 要素のスタイルを設定しようとしています。選択コードは非常にシンプルで、ドロップダウンのテキストの色をスタイルできます。ただし、オプションが選択されている場合、これは選択要素のスタイルを設定しません。また、このコードは Safari ではまったく機能しません。

コード：

<div class="theme">
<select class="theme" name="select_theme">
    <option value="red">Red</option>
    <option value="green">Green</option>
    <option value="blue">Blue</option>
</select>
</div>

CSS:

.theme {
    width: 200px;
}
.theme select {
    width: 200px;
    background-color: rgba(200,200,200,0.8);
}
.theme select option[value="red"] {
   color: red;
}
.theme select option[value="green"] {
    color: green;
}
.theme select option[value="blue"] {
    color: blue;
}
  1. オプション スタイル ルールに一致するようにデフォルトの選択をスタイルするにはどうすればよいですか?
  2. これをSafariで動作させるにはどうすればよいですか? おそらく IE まだチェックしていませんが、Windows システムの ATM はありません。
  3. これらのルールを取得して画像も表示する方法はありますか? 私はいくつかのことを試しましたが、できる限り避けようとする Javascript が必要なようです。

これを実証するためにJSFiddleを作成しました。

4

1 に答える 1

3

JavaScript なしでこれを達成する方法はありません。

$('select.theme').change(function () {
    $(this).css('color', $(this).find('option:selected').css('color'));
}).change();

これがあなたのフィドルです：http://jsfiddle.net/uCmSR/2/

于 2013-09-16T02:10:39.763 に答える