修改HTML5 input placeholder 颜色及修改失效的解决办法

input::input-placeholder{color:  #bdbdbd ;} /* 有些资料显示需要写,有些显示不需要,但是在编辑器webstorm中该属性不被识别 */
::-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;
} 

这段代码在单独试用没有问题,在有时候做项目的时候会出现加此代码不生效的情况,原因可能是项目用的框架中底层已经写好了placeholder的属性颜色,再写一个不能替换掉底层颜色,所以必须给每个属性值加!important

这样就可以成功执行了。

时间: 2025-01-01 12:36:04

修改HTML5 input placeholder 颜色及修改失效的解决办法的相关文章

用css修改HTML5 input placeholder颜色

使用CSS修改HTML5 input placeholder颜色 本文选自StackOverflow(简称:SOF)精选问答汇总系列文章之一,本系列文章将为读者分享国外最优质的精彩问与答,供读者学习和了解国外最新技术.本文将为读者讲解HTML5 Input Placeholder Color的个性化设定,需要针对不同浏览器内核来编程. 问题: David Murdoch:Chrome支持input=[type=text]占位文本属性,但下列CSS样式却不起作用: CSS input[placeh

使用CSS修改HTML5 input placeholder颜色

问题没有实际价值,缺少关键内容,没有改进余地 Chrome支持input=[type=text]占位文本属性,但下列CSS样式却不起作用: CSS input[placeholder], [placeholder], *[placeholder] { color:red !important; } HTML <input type="text" placeholder="Value" /> 运行结果值还是灰色,Color:red没有作用.有什么方法可以修

如何修改HTML5 input placeholder 颜色

有三种实现方式:伪元素(pseudo-elements).伪类( pseudo-classes)和Notihing. WebKit和Blink(Safari,Google Chrome, Opera15+)使用伪元素 ::-webkit-input-placeholder :-moz-placeholder ::-moz-placeholder :-ms-input-placeholder 因为每个浏览器的CSS选择器都有所差异,所以需要针对每个浏览器做单独的设定. 1 ::-webkit-in

HTML5 input placeholder 颜色修改

input::-webkit-input-placeholder { /* WebKit browsers */ color: #999; } 主要是webkit内容浏览器 参考: http://www.jb51.net/html5/171764.html

修改mysql字符编码出现Job failed to start解决办法

从网上找到如下资料: $sudo gedit /etc/mysql/my.cnf [client]下添加: default-character-set=utf8 [mysqld]下添加: default-character-set=utf8 然后保存退出 $ /etc/init.d/mysql restart 结果出现了: Since the script you are attempting to invoke has been converted to an Upstart job, you

浏览器禁用Cookie,基于Cookie的会话跟踪机制失效的解决办法

当浏览器禁用Cookies时,基于Cookie的会话跟踪机制就会失效,解决办法是利用URL重写机制跟踪用户会话. 在使用URL重写机制的时候需要注意,为了保证会话跟踪的正确性,所有的链接和重定向语句中的URL都需要调用encodeURL()或encodeRedirectURL()方法进行编码.另外,由于附加在URL中的SessionID是动态产生的,对于每一个用户都是不同的,所欲对于静态页面的相互跳转,URL重写机制就无能为力了,但是,我们也可以通过将静态页面转换为动态页面来解决这个问题. 在w

IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题

(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在父标签中加入overflow:hidden:或zoom:100%示例代码: 不正常显示 ul{} li{ list-style:none; float:left; margin:10px;} 1. 你会发现左边10px 变成20px了, 解决办法:在li的CSS中加入:display:inline

[转]iOS Safari 中click点击事件失效的解决办法

iOS Safari 中click点击事件失效的解决办法 问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素添加click事件时,如果事件是委托到 document 或 body 上,并且委托的元素是默认不可点击的(如 div, span 等),此时 click 事件会失效. 解决办法 解决办法有 4 种可供选择: ?将 click 事件直接绑定到目标?元素(??即 .target)上 将目标?元素换成 

iOS Safari 中click点击事件失效的解决办法

问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素添加click事件时,如果事件是委托到 document 或 body 上,并且委托的元素是默认不可点击的(如 div, span 等),此时 click 事件会失效. 解决办法 解决办法有 4 种可供选择: ?将 click 事件直接绑定到目标?元素(??即 .target)上 将目标?元素换成 <a> 或者 button 等可点击的?元素 ?将 cl