Chrome支持input[type=text]元素的占位符属性(其他元素可能也支持)。
但以下CSS对占位符的值没有任何作用:
输入[占位符]、[占位符],*[占位符]{颜色:红色!重要的}<input-type=“text”placeholder=“Value”>
但Value仍将保持灰色而不是红色。
是否有方法更改占位符文本的颜色?
Chrome支持input[type=text]元素的占位符属性(其他元素可能也支持)。
但以下CSS对占位符的值没有任何作用:
输入[占位符]、[占位符],*[占位符]{颜色:红色!重要的}<input-type=“text”placeholder=“Value”>
但Value仍将保持灰色而不是红色。
是否有方法更改占位符文本的颜色?
当前回答
这会很好的。此处演示:
input::-webkit输入占位符,textarea::-webkit输入占位符{颜色:#666;}输入:-moz占位符,文本区域:-moz占位符{颜色:#666;}input::-moz占位符,文本区域::-moz占位符{颜色:#666;}input:-ms输入占位符,文本区域:-ms输入占位符{颜色:#666;}<input type=“text”placeholder=“Value”/>
其他回答
试试这个吧
input::placeholder
color:#900009;
}
对于Bootstrap用户,如果您使用class=“form control”,则可能存在CSS特定性问题。您应该获得更高的优先级:
.form-control::-webkit-input-placeholder {
color: red;
}
//.. and other browsers
或者如果您使用的是Less:
.form-control{
.placeholder(red);
}
现在,我们有了一种标准的方法来将CSS应用于这个CSS模块Level 4草稿中输入的占位符::占位符伪元素。
CSS提供::占位符伪元素。
请注意,Bootstrap中的.placeholder mixin已被弃用。
例子:
input::placeholder { color: black; }
当使用autorefixer时,以上代码将被转换为适用于所有浏览器的正确代码。
Compass有一个开箱即用的混音器。
举个例子:
<input type="text" placeholder="Value">
在SCSS中使用指南针:
input[type='text'] {
@include input-placeholder {
color: #616161;
}
}
有关输入占位符mixin,请参阅文档。