css更改placeholder的样式

宇宙无敌小可爱

于 2017-11-20 18:10:10 发布

阅读量3.3w

点赞数 3

CC 4.0 BY-SA版权

分类专栏： css兼容文章标签： css placeholder

本文链接：https://blog.youkuaiyun.com/diwuyanting/article/details/78585000

css兼容专栏收录该内容

3 篇文章

订阅专栏

本文介绍如何使用CSS来更改HTML输入框中占位符（placeholder）的字体颜色及大小，提供了详细的代码示例，适用于多种浏览器。

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

可以用css更改placeholder的字体颜色 html:

<textarea class="input" maxlength="200"  name="text"  placeholder="请输入文字" ></textarea>

css:


.input::-webkit-input-placeholder {
    color: red;
}
.input:-moz-placeholder {
    color: red;
}
.input:-ms-input-placeholder {
    color: red;
}

结果图：

或者也可以更改字体大小：

.input::-webkit-input-placeholder {
    color: red;
    font-size: 25px;
}
.input:-moz-placeholder {
    color: red;
    font-size: 25px;
}
.input:-ms-input-placeholder {
    color: red;
    font-size: 25px;
}

结果图：