CSS选择器前的Firefox占位符不工作

我正在使用最新的Firefox30.0。我正在尝试在必填字段的占位符之前插入一个红色的星形字体。我在Chrome上工作没有问题，但我在FF和

这是一个密码笔，说明了我的问题-

我的标记：

<input placeholder="Address" data-required required id="id_street" name="street" type="text" />

注：原来IE也让我很难受

---

谢谢你的帮助

问题不在于占位符，而在于您试图将

：：before

伪元素应用于

输入

，这是不受跨浏览器支持的，因为标准中没有定义它。看

---

由于这显然取决于表单元素是

[data required]

（尽管我不清楚为什么除了标准

required

之外还需要

data required

属性），您可能需要在

输入

之后添加一个额外的

span

元素，并使用同级选择器而不是伪元素来设置该元素的样式。

问题不在于占位符，而在于您正试图将

伪元素应用于
输入
之前：，不支持跨浏览器，因为标准中未定义它。看

由于这显然取决于表单元素是
[data required]
（尽管我不清楚为什么除了标准
required
之外还需要
data required
属性），您可能需要在
input
之后添加一个额外的
span
元素，并使用同级选择器而不是伪元素设置该元素的样式

[data-required] {
    &::-webkit-input-placeholder::before { font-family: fontAwesome; content:'\f005  '; color: $color-red; }
    &::-moz-placeholder::before { font-family: fontAwesome; content:'\f005  '; color: $color-red; } /* firefox 19+ */
    &:-ms-input-placeholder::before { font-family: fontAwesome; content:'\f005  '; color: $color-red; } /* ie */
}