CSS ::placeholder 选择器
CSS ::placeholder 可以选择一个表单元素的占位文本,它允许开发者和设计师自定义占位文本的样式。
在使用了 ::placeholder 伪元素的选择器中,仅有小一部分 CSS 属性可以使用,这个集合可以参考 ::first-line 伪元素。
实例
更改输入字段的占位符文本的颜色:
<!DOCTYPE html><html><head><style>::-webkit-input-placeholder { /* Edge */color: red;}:-ms-input-placeholder { /* Internet Explorer */color: red;}::placeholder {color: red;}</style></head><body><p>请使用 ::placeholder 选择器来改变占位文本的颜色:</p><input type="text" name="fname" placeholder="First name"></body></html>
定义和用法
::placeholder 选择器用于选取带有占位符文本的表单元素,并让您设置占位符文本的样式。
占位符文本使用 placeholder 属性设置,这个属性规定描述输入字段期望值的提示文本。
提示:在大多数浏览器中,占位符文本的默认颜色为浅灰色。
浏览器支持
表格中的数字注明了完全支持该选择器的首个浏览器版本。
后面跟 -webkit-、-moz- 或 -ms- 的数字指示使用前缀的首个版本。
| 选择器 | |||||
|---|---|---|---|---|---|
| ::placeholder | 57.04.0 -webkit- | 12.0 -webkit-10.0 -ms- | 51.04.0 -moz- | 10.15.0 -webkit- | 44.015.0 -webkit- |
CSS 语法
::placeholder {css declarations;}