IE和FF中的占位符颜色不同

Question

我有HTML表单和占位符css代码

#email::-webkit-input-placeholder {
    font-weight:400;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    color:#333 !important;
}
#email::-moz-placeholder {
    font-weight:400;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    color:#333 !important;
}
#email:-ms-input-placeholder { font-weight:400;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    color:#333 !important;
}
#email::-ms-input-placeholder { font-weight:400;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    color:#333 !important;
}
#email::placeholder { font-weight:400;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    color:#333 !important;
}

IE示例：

FF示例：

你能帮帮我吗？

Answer 1

在Firefox中，与其他浏览器相比，占位符的颜色看起来很淡。在下图中，Firefox显示在左侧，而Chrome显示在右侧：

这是因为，默认情况下，Firefox中的所有占位符都应用了不透明度值，因此为了解决这个问题，您需要简单地重置该值，在您的情况下添加：

#email::-moz-placeholder {
  opacity: 1;
}

我是从CSS-tricks中学到的，here's the source。