在页脚元素中设置输入的占位符颜色不起作用

Question

所有人！

编辑

看一下fiddle I created，它看起来内部页脚元素占位符样式不起作用。你知道怎么克服这个问题吗？

我试着使用：

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color:    #3d3d3d!important;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #3d3d3d!important;
   opacity:  1!important;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #3d3d3d!important;
   opacity:  1!important;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #3d3d3d!important;
}
:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
  color:    #3d3d3d!important;
}

以及：

footer::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color:    #3d3d3d!important;
}

但这也没什么用。

请记住，我想要一个单独的颜色占位符文本和用户键入的输入文本。

你知道从哪里开始吗？

Answer 1

好吧，这真的很愚蠢。input元素中添加了一个javascript：

<input type="text" name="woochimp_widget_subscription[email]" id="woochimp_widget_subscription_email" class="woochimp_widget_field" required="" value="Enter your email..." onfocus="this.value='';" onblur="if(this.value=='')this.value='Enter your email...';" />

删除js代码并添加placeholder属性后：

<input type="text" name="woochimp_widget_subscription[email]" id="woochimp_widget_subscription_email" class="woochimp_widget_field" required="" value="Enter your email..." placeholder="Enter you email..." />

它开始变得很好。

感谢大家的帮助！

Answer 2

这可能不会有什么不同，但请尝试移动注释，使其落入样式声明之外。

另外，别忘了包括：

::-ms-input-placeholder {color: #3d3d3d;}  /* Edge */

完整样式：

::-webkit-input-placeholder {color: #3d3d3d;} /* WebKit, Blink and Opera */

:-moz-placeholder {color: #3d3d3d; opacity: 1;} /* Mozilla Firefox 4 to 18 */

::-moz-placeholder {color: #3d3d3d; opacity: 1;} /* Mozilla Firefox 19+ */

:-ms-input-placeholder {color: #3d3d3d;} /* Internet Explorer 10-11 */

::-ms-input-placeholder {color: #3d3d3d;}  /* Edge */

:placeholder-shown {color: #3d3d3d;} /* CSS Level 4 Selector */

Answer 3

#coupon_code::-moz-placeholder {
color: #d3d3d3!important;
opacity: 1!important;
}

我已经在你的小提琴上面的css行的变化，希望这将对你有帮助。