您当前的位置:首页 > 计算机 > 编程开发 > Html+Div+Css(前端)

input placeholder 兼容性处理

时间:12-14来源:作者:点击数:

若要修改 <input /> 元素 placeholder 属性的样式,需要兼容多种浏览器,如下:

/* WebKit, Blink, Edge */
input::-webkit-input-placeholder {
  color: #eee !important;
  font-size: 16px !important;
}

/* Mozilla Firefox 19+ */
.input::-moz-placeholder {
  color: #eee !important;
  font-size: 16px !important;
}

/* Mozilla Firefox 4 to 18 */
.input:-moz-placeholder {
  color: #eee !important;
  font-size: 16px !important;
}

/* Internet Explorer 10-11 */
.input:-ms-input-placeholder {
  color: #eee !important;
  font-size: 16px !important;
}

设置不生效?

若设置 placeholder 的样式不生效,原因可能是在某些公共样式已经对 placeholder 进行设置了,再一次设置就会无效。解决方法是,添加 !important 增加权重。

方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门
本栏推荐