Question

这个问题与this one非常相关，但在阅读并尝试了不同的jsfiddles后，我无法在我的案例中使用它。

我有一个现有的源代码库，它有bootstrap 2.3.1和LESS。目前我无法修改或重新编译LESS，我只能修改现有的HTML并使用内联样式。

是否可以包含此内容：

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #999;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #999;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #999;
}

在一个带有占位符的简单输入字段中：

<input id="some_id" placeholder="Lorem ipsum rocks da house!"/>

我尝试过与此jsfiddle类似的功能并取得了一些成功（我只能更改字体大小）但我读过LESS的引导程序占位符为mixin我认为是在干扰这种方法。实际上，如果我刷新，我可以看到内联指定的样式的几分之一秒，但然后突然改变到我认为在mixin中指定的内容。

任何想法如何克服这个？

谢谢！

Answer 1

尝试将“！important”语句添加到您的所有规则中......如下所示：

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #999 !important;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #999 !important;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #999 !important;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #999 !important;
}

...这应该强制浏览器在LESS mixins上使用这些规则

如何包含css样式来修改现有的占位符

1 个答案: