Laravel  
laravel
文档
数据库
架构
入门
php技术
    
Laravelphp
laravel / php / java / vue / mysql / linux / python / javascript / html / css / c++ / c#

css placeholder颜色

作者:伪言   发布日期:2026-03-16   浏览:79

/* 设置 placeholder 颜色的 CSS 代码 */

/* 对于 WebKit 浏览器(如 Chrome 和 Safari) */
::-webkit-input-placeholder {
    color: #999; /* 设置 placeholder 文本颜色为灰色 */
}

/* 对于 Mozilla Firefox 浏览器 */
:-moz-placeholder {
    color: #999;
}

/* 对于更新版本的 Firefox 浏览器 */
::-moz-placeholder {
    color: #999;
}

/* 对于 Internet Explorer 和 Microsoft Edge 浏览器 */
:-ms-input-placeholder {
    color: #999;
}

/* 对于更新版本的 Microsoft Edge 浏览器 */
::-ms-input-placeholder {
    color: #999;
}

/* 对于所有现代浏览器 */
::placeholder {
    color: #999;
}

解释说明:

  • ::-webkit-input-placeholder:用于设置 WebKit 内核浏览器(如 Chrome 和 Safari)中的 placeholder 颜色。
  • :-moz-placeholder::-moz-placeholder:分别用于较旧和较新的 Firefox 浏览器。
  • :-ms-input-placeholder::-ms-input-placeholder:用于 Internet Explorer 和 Microsoft Edge 浏览器。
  • ::placeholder:这是一个标准的 CSS 伪元素,适用于所有现代浏览器。

通过这些规则,你可以确保在不同浏览器中,输入框的 placeholder 文本颜色都能正确显示为你指定的颜色。

上一篇:css文字添加下划线

下一篇:css超出部分省略号

大家都在看

css好看的字体

css 红色

css 瀑布流布局grid

css盒子

css三种引入方式

换行 css

css文字超长省略号

css图片铺满整个背景

css背景图铺满

css 渐变字体

Laravel PHP 深圳智简公司。版权所有©2023-2043 LaravelPHP 粤ICP备2021048745号-3

Laravel 中文站