стилизация отключенного комбинированного списка в Internet Explorer

Question

Скажи, что у меня было следующее:

<select disabled="disabled" style="border: 1px red solid; color: black;">
<option>ABC</option>
</select>

Firefox отображает вышесказанное с красной рамкой и черным текстом, как я и ожидал; но IE нет, кажется, он использует собственные цвета для границы и отключенного текста. Можно ли как-нибудь украсить его?

Для блоков редактирования моим обходным решением было использовать readOnly вместо отключенного, чтобы я мог его стилизовать, но для комбо-полей кажется, что атрибут readOnly не действует.

Примечание: мне нужно это только для работы в IE (это для веб-приложения в интрасети, где пользователи должны использовать IE), поэтому решения для IE вполне подойдут.

Answer 1

В хорошем приближении, вы вообще не можете стилизовать комбинированные списки; они не "настоящие" объекты браузера. Более подробное объяснение и возможный обходной путь см. Здесь: Можно ли стилизовать поле выбора?

В качестве альтернативы, если вы просто хотите поставить границы, оберните их в промежуток и ограничьте их.

<span class="disabled-select">
    <select disabled="disabled">
        <option>ABC</option>
    </select>
</span>

с

span.disabled-select {
    border: 1px solid red;
}

Большинство других свойств, таких как цвет и т. Д., Вероятно, не будут иметь эффекта.

Answer 2

Ваш лучший вариант - использовать javascript для управления элементами, я включил несколько скриптов ниже:

• http://info.wsisiz.edu.pl/~suszynsk/jQuery/demos/jquery-selectbox/

• http://brilliantretail.com/cases/select/

• http://www.emblematiq.com/projects/niceforms/

Я когда-либо использовал только первый, но я надеюсь, что они отвечают вашим потребностям.

Answer 3

Одна возможность может быть ... Нарисуйте ваше поле со списком в таблице 1 X 1 и ширина равна ширине поля со списком и ширина поля со списком = 100% .. cellpadding = 0, cellspacing = 0 ... затем рисовать желаемую границу вокруг этого стола.