1、CSS选择器

因为每个浏览器的CSS选择器有所差异,所以需要针对每个浏览器做单独的设定。

::-webkit-input-placeholder { /* WebKit browsers */ 
color: #999; 

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
color: #999; 

::-moz-placeholder { /* Mozilla Firefox 19+ */ 
color: #999; 

:-ms-input-placeholder { /* Internet Explorer 10+ */ 
color: #999; 
}

2、textarea风格样式的代码,如下:

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { 
color: #636363; 

input:-moz-placeholder, textarea:-moz-placeholder { 
color: #636363; 
}

3、指定修改哪个input的placehoder属性,可以使用class

input.addCardInput::-webkit-input-placeholder{
color: #ccc;
}
input.addCardInput:-moz-placeholder{
color: #ccc;
}
input.addCardInput::-moz-placeholder{
color: #ccc;
}
input.addCardInput:-ms-input-placeholder{
color: #ccc;
}

4、在Firefox和IE里,正常input文本颜色覆盖占位符颜色的方法:

::-webkit-input-placeholder { 
color: red; text-overflow: ellipsis; 

:-moz-placeholder { 
color: #acacac !important; text-overflow: ellipsis; 

::-moz-placeholder { 
color: #acacac !important; text-overflow: ellipsis; 
} /* for the future */ 
:-ms-input-placeholder { 
color: #acacac !important; text-overflow: ellipsis; 
}

转载于:https://www.cnblogs.com/carriezhao/p/6927431.html

修改input的placeholder颜色相关推荐

  1. 如何修改input的placeholder的文字颜色

    最近项目出现了一个特殊的需求,需要修改input框中文字的颜色,这里我们想到的就是修改placeholder的颜色, 但是placeholder一般我们使用的都是他的默认颜色,那么我们如何更改他呢. ...

  2. HTML中placeholder字体颜色,修改input中placeholder字体颜色方法

    如上,input的placeholder属性我们无需修改,但是如果恰巧我们设置的背景色和placeholder默认颜色一样的话,尴尬的事情就发生了,很小的一个问题会耽误我们不少时间查找什么原因造成的. ...

  3. 修改input的placeholder字体颜色

    效果 html <input type="text" class="name inputProgramColor" placeholder="请 ...

  4. css修改输入框的placeholder颜色

    2019独角兽企业重金招聘Python工程师标准>>> ::-webkit-input-placeholder { /* WebKit browsers */color: #999; ...

  5. html 修改placeholder,修改input placeholder样式

    有时需要修改placeholder的文字颜色,需要用使用 input::-webkit-input-placeholder 选中,然后进行样式设置input::-webkit-input-placeh ...

  6. 使用CSS修改HTML5 input placeholder颜色

    有三种实现方式:伪元素(pseudo-elements).伪类( pseudo-classes)和Notihing. WebKit和Blink(Safari,Google Chrome, Opera1 ...

  7. html输入框颜色属性,css 修改input输入框属性

    1.修改输入框颜色背景色等 input[type=text] { width: 340px; padding: 0 25px; height: 48px; border: 1px solid #f2f ...

  8. HTML5 input placeholder 颜色 改动

    David Murdoch:Chrome支持input=[type=text]占位文本属性,但下列CSS样式却不起作用: CSS input[placeholder], [placeholder], ...

  9. 设置 input元素placeholder的字体颜色

    placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示,并会在字段获得焦点时消失. placeholder 属性适用于以下的 <input&g ...

最新文章

  1. 太多选择——企业如何选择合适的BI工具?
  2. 检测1的个数_冲床电永磁夹紧系统(PMCS),实现1分钟的快速换模~
  3. 《深入理解Java虚拟机》读书笔记八
  4. 华为M2平板打不开云课堂_能运行PC应用的安卓生产力平板:华为MatePad Pro 5G登场...
  5. [js] 解释下深度优先遍历和广度优先遍历的区别及如何实现
  6. python的convert_python编程开发之类型转换convert实例分析
  7. boot druid 长时间不连接 异常_Spring Boot学习:如何使用Druid数据源
  8. (83)FPGA仿真完成激励(finish)
  9. 爱奇艺、优酷、腾讯独播内容均超70%,如果只能三选一,哪家会员最值得买?
  10. pod trunk push --verbose 失败的原因总结
  11. 奔驰车载逻辑单元 (OLU) 源代码遭泄露
  12. RHEL6解决无法使用YUM源问题
  13. Linux内核分析考试试题,linux内核分析第二周作业
  14. 私网互联(本质是三层路由)
  15. 3种常用的Redis缓存读写策略
  16. 1000套微信小程序源码模板分享下载,各种类型任意选择
  17. wps指定路径不存在怎么办_WPS说目录不存在
  18. 球体弹性碰撞位置和速度计算算法
  19. win10重置网络命令_WIN10重置网络的操作方法
  20. EasyClick 原生UI 制作水印图

热门文章

  1. RegularExpressionValidator 常用
  2. ListView展示SIM信息
  3. 利用ASP.NET向服务器上传文件[转]
  4. UDP Socket编程 C/C++实现 (Windows Platform SDK)
  5. c函数scanf(),printf()等常用格式字符串
  6. Axis2 WebService(配置、发布、调用)
  7. Panda处理文本和时序数据?首选向量化
  8. Python应用实战-如何使用Plotly绘制精美图形?
  9. java 缓存接口,java项目中,针对缓存问题的处理方式【接口中的处理方式】
  10. 背包问题 贪心算法 java_JS基于贪心算法解决背包问题