IE7で無効にした選択ボックスを設計しようとしています。
<div id="wwctrl_pay" class="wwctrl styled-select">
<select id="payment"><option>...</option></select>
</div>
#wwctrl_pay
選択ボックスが無効になっている場合のCSSを変更するにはどうすればよいですか?CSSを使用してそれを行うことはできますか?
IE7で無効にした選択ボックスを設計しようとしています。
<div id="wwctrl_pay" class="wwctrl styled-select">
<select id="payment"><option>...</option></select>
</div>
#wwctrl_pay
選択ボックスが無効になっている場合のCSSを変更するにはどうすればよいですか?CSSを使用してそれを行うことはできますか?
最適なオプションは、選択ボックスを無効にして、新しいクラスを追加し、そのクラス内にスタイルを追加することです。
追加のマークアップやその他の制限を気にしない場合:
<div id="wwctrl_pay" class="wwctrl styled-select">
<select id="payment" disabled="disabled"></select>
<div></div>
</div>
CSS:
.wwctrl {
position: relative;
border: 1px solid blue;
}
select[disabled] + div {
position: absolute;
z-index: -1;
top: 0; left: 0;
width: 100%; height: 100%;
background: yellow;
}
または、これがIE7専用の場合は、IE独自のcss式機能を使用してみてください。