在CSS中输入值大写,不影响占位符

前端之家收集整理的这篇文章主要介绍了在CSS中输入值大写,不影响占位符前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
有没有办法使输入值大写而不占位符大写?

好像我得到一个或另一个。我宁愿干净地使用CSS(JS最后手段)。

解决方法

每个浏览器引擎都有一个不同的实现来控制占位符的样式。使用以下内容

jsBin example.

input { 
    text-transform: uppercase;
}
::-webkit-input-placeholder { /* WebKit browsers */
    text-transform: none;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    text-transform: none;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    text-transform: none;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    text-transform: none;
}

不用说,这只适用于可以处理占位符的浏览器。 (IE9 / 10)

猜你在找的CSS相关文章