2

我只需要在 Firefox 中将占位符居中，但不起作用，占位符出现在左侧。

CSS **

:-moz-placeholder { text-align:center; } /*FF Old*/
::-moz-placeholder { text-align:center; } /*FF19+*/
::-webkit-input-placeholder{ text-align:center; } /*Chrome*/
:-ms-input-placeholder{ text-align:center; } /*IE10*/

HTML **

<input id="test" placeholder="test!">

你可以用你的 FF23 和http://jsfiddle.net/eliaspizarro/ze4fV/试试这个错误

4

1 回答 1

4

这不完全是一个错误。目前还没有浏览器供应商可以遵循的规范。:placeholder-shown尽管浏览器现在不支持它，但它似乎正朝着标准化的方向发展。

非标准::-moz-placeholder受限于它可以接受的样式规则。text-align不是接受的规则之一（该规则没有CSS_PROPERTY_APPLIES_TO_PLACEHOLDER设置位）。

因此，在撰写本文时，您不能使用text-alignwith ::-moz-placeholder。

但是，您可以text-align整个<input>.

如果您只希望占位符文本居中，而不是输入文本，那么您可以添加一些 Javascript 以.style.textAlign根据<input>.value它何时更改进行设置。这是一个令人讨厌的解决方法，但应该可以。例如看到这个小提琴。

<input>.addEventListener("input", function(e) {
    this.style.textAlign = this.value === "" ? "center" : "left";
});
于 2013-09-12T11:28:48.730 回答