Question

标题说明了一切。我可以更改JQuery UI的Datepicker占位符的颜色吗？

Datepicker供参考：http://jqueryui.com/datepicker/

<input type="text" id="datepicker" placeholder="Enter Date">

Answer 1

是的，如本文所述：https://css-tricks.com/almanac/selectors/p/placeholder-shown/

::-webkit-input-placeholder { /* Safari, Chrome and Opera */
  color: orange;
}

:-moz-placeholder { /* Firefox 18- */
  color: orange;
}

::-moz-placeholder { /* Firefox 19+ */
  color: orange;
}

:-ms-input-placeholder { /* IE 10+ */
  color: orange
}

::-ms-input-placeholder { /* Edge */
  color: orange
}

:placeholder-shown { /* Standard one last! */
  color: orange;
}

关于浏览器兼容性：

Chrome  Safari  Firefox  Opera  IE    Edge   Android    iOS
4+*       5+*     4+*     33+*  10+*  Yes*     Yes*     Yes*

*此信息来自同一篇文章！

看看： https://jsfiddle.net/guez0tb9/1/

Answer 2

简单添加以下css：

::-webkit-input-placeholder { color:#f00; }
::-moz-placeholder { color:#f00; } /* firefox 19+ */
:-ms-input-placeholder { color:#f00; } /* ie */
input:-moz-placeholder { color:#f00; }

<强> Working Fiddle

检查more information

Answer 3

这与任何输入表单字段占位符的相同。你可以在下面使用：

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    red;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    red;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    red;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    red;
}

Answer 4

有多种方法可以改变占位符文本的颜色。在你的文件中添加一些css。

              <style>
               ::-moz-placeholder { /* Mozilla Firefox 19+ */
                 color:    #909;
                  opacity:  1;
                  }
               <\style>

我可以更改JQuery Datepicker占位符文本的颜色吗？

4 个答案: