浏览器INPUT文本选择颜色

Question

在使用jQuery UI和jQx的项目中，我们将应用于用户选择主题的所有表单字段并遇到此问题：

在输入（文本）字段中选择文本时，浏览器的背景颜色不同。我知道这是浏览器/操作系统特定的，但它会导致这种奇怪的现象：

铬

IE 8和9

如您所见，IE中的选定文本可能会导致问题，因为选择背景颜色与元素的其余部分混合在一起。 （为什么IE将此颜色设置为白色超出了我的范围。）

我尝试了“changing text selection color”CSS技巧，但它可以在其他地方工作，而不是我想要改变的地方。

是否存在一些伏都教魔法或其他一些记录不佳的功能，这些功能可以使IE表现得更不像......它的行为如何？ （并希望IE10 真的 sucks less。）

Answer 1

即使这个问题已经很久了，我还是在这里回答是为了拯救其他试图解决这个问题的人，这是不可能的。当我们偶然发现答案时，我们已经准备好放弃并接受Internet Explorer中的这种行为。

似乎Internet Explorer对任何在其样式中设置了颜色的文本框中的选定文本使用此突出显示方法 - 如果删除此属性，突出显示将正常工作。

当我们将color属性移动到自己的类中并将两个类应用到文本框时，我们偶然发现了答案。

以下将在IE中展示此文本选择突出显示：

<input type="text" id="uiSizeWidth" class="SizeInput">

.SizeInput {
    width: 70px;
    text-align: center;
    height: 30px;
    font-weight: bold;
    margin: 2px;
    color: #ef4915;
}

但这不会：

<input type="text" id="uiSizeWidth" class="SizeInput InputColor">

.SizeInput {
    width: 70px;
    text-align: center;
    height: 30px;
    font-weight: bold;
    margin: 2px;
}

.InputColor {
    color: #ef4915;
}

然后，您可以使用以下CSS将突出显示设置为以下内容：

::-moz-selection {
    color: #fff;
    background: #39f;
}