Skip to main content

textarea 提示文字颜色

在 HTML 中,可以使用 textarea 元素来创建多行文本输入框。要在 textarea 元素中添加提示文字,可以使用 placeholder 属性。默认情况下,这个提示文字的颜色通常是浅灰色的。

要修改 textarea 中提示文字的颜色,可以使用 CSS 的 ::placeholder 伪元素来设置。

以下是一个示例,演示如何将 textarea 中的提示文字颜色设置为红色:

html

复制代码

<textarea placeholder="请输入内容"></textarea> <style> textarea::placeholder { color: red; } </style>

在上面的示例中,我们使用 CSS 选-择器 textarea::placeholder 来选择 textarea 中的提示文字,并将其颜色设置为红色。

值得注意的是,::placeholder 伪元素不是所有浏览器都支持的,因此如果您需要兼容多个浏览器,最好提供一个默认颜色作为备选方案。以下是一个示例,演示如何为不支持 ::placeholder 的浏览器提供默认颜色:

html

复制代码

<textarea placeholder="请输入内容"></textarea> <style> /* 默认颜色 */ textarea::-webkit-input-placeholder { color: #999; } textarea::-moz-placeholder { color: #999; } textarea::-ms-placeholder { color: #999; } /* 支持 ::placeholder 的颜色 */ textarea::placeholder { color: red; } </style>

在上面的示例中,我们使用 -webkit-input-placeholder-moz-placeholder 和 -ms-placeholder 选择器来为不支持 ::placeholder 的浏览器提供默认颜色。同时,我们也保留了 ::placeholder 的颜色设置,以确保在支持 ::placeholder 的浏览器中可以看到红色的提示文字。

textarea 提示文字颜色-掘金