CSS:浏览器设置placeholder样式 / 微信小程序设置placeholder样式

一、web 设置placeholder

设置浏览器的placeholder样式

css 复制代码
::-webkit-input-placeholder { /* WebKit browsers */
    color: #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #999;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #999;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #999;
}

二、微信小程序设置placeholder

在小程序中设置placeholder样式需要使用组件的内置属性。可以通过以下方式设置input和textarea的placeholder样式:

html 复制代码
<!-- input组件 -->
<input placeholder-style="color:#999;font-size:14px;" />

<!-- textarea组件 -->
<textarea placeholder-style="color:#999;font-size:14px;"></textarea>

在上面的示例中,placeholder-style属性被设置为一个字符串,包含了CSS样式。在这个字符串中,您可以设置任何CSS样式属性,例如颜色、字体大小、字体样式等。

请注意,这些属性仅适用于placeholder文本,而不是输入的文本。如果您需要设置输入文本的样式,应该将样式应用到输入框或文本域本身。

三、欢迎交流指正

参考链接

关于微信小程序设置placeholder样式最简便操作_善良美丽大方可爱真棒的博客-CSDN博客

设置placeholder属性样式的多种写法_placeholder样式_李梅思的博客-CSDN博客

相关推荐
季春二九7 分钟前
Edge 卸载工具 | 版本号1.0 | 专为彻底卸载Microsoft Edge设计
前端·microsoft·edge·edge 卸载工具
雨过天晴而后无语8 分钟前
HTML中JS监听输入框值的即时变化
前端·javascript·html
座山雕~11 分钟前
html 和css基础常用的标签和样式(2)-css
前端·css·html
一勺菠萝丶14 分钟前
为什么 HTTP 能访问,但 HTTPS 却打不开?——Nginx SSL 端口配置详解
前端
4Forsee23 分钟前
【Android】消息机制
android·java·前端
不爱说话郭德纲24 分钟前
UniappX不会运行到鸿蒙?超超超保姆级鸿蒙开发生成证书以及配置证书步骤
前端·uni-app·harmonyos
Olafur_zbj26 分钟前
【IC】NoC设计入门 -- 网络接口NI Slave
前端·javascript·php
IT_陈寒31 分钟前
React性能优化:10个90%开发者不知道的useEffect正确使用姿势
前端·人工智能·后端
赵小川34 分钟前
告别“切图仔”?我用一个神器,让Figma设计稿自动生成前端代码!
前端
Apifox34 分钟前
如何在 Apifox 中使用 OpenAPI 的 discriminator?
前端·后端·测试