placeholder颜色的修改

布织锁云

已于 2023-03-26 20:28:44 修改

阅读量477

点赞数

文章标签：前端 css

于 2023-03-26 20:24:12 首次发布

本文链接：https://blog.youkuaiyun.com/qq_52731478/article/details/129783854

版权

文章讲述了如何使用CSS对HTML5中的placeholder属性进行样式控制，包括在WebKit、Edge、Blink（Chrome）、Firefox不同版本以及IE10+浏览器中设置提示文字的颜色。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

placeholder

placeholder是HTML5中新增的表单属性，用于提示用户信息
在这里插入图片描述
字体颜色的修改

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

WebKit、Edge、Blink 浏览器需要以标签类型:开头，带上-webkit-前缀；
火狐浏览器只需要带上-moz-前缀，
针对火狐浏览器的版本有两种写法：低版本使用单冒号，高版本使用双冒号；
placeholder属性只在IE10+才支持，
IE10、IE11需要以标签类型:开头，带上-ms-前缀