可以将 CSS 样式应用于占位符,例如 Firefox:
::-moz-placeholder { text-decoration: underline; }
但是,我想做的是在占位符中加下划线,以提示用户按下热键(类似于文件菜单中的 Windows),例如制作 F
在 First Name
中,下划线:
<input type='text' placeholder='First Name' />
有什么办法吗?
最佳答案
我认为您只能在谷歌浏览器中使用 CSS 来实现这一点。例如:
可以选择占位符的首字母
::-webkit-input-placeholder::first-letter {
color: red;
text-decoration:underline;
}
结果:
在 Chrome(版本 39.0.2171.71)中使用 :first-letter 设置时,文本装饰不会呈现。所以我们可以用border-bottom来实现下划线。
::-webkit-input-placeholder::first-letter {
color: red;
border-bottom: 1px solid red;
}
结果:
更新:文本装饰在 Chrome 41.0.2235.0 Canary 上运行良好。
这是演示:http://codepen.io/MizR/pen/myeJZe
不幸的是,此解决方案不适用于 Firefox。 :(
更新 2: 不再有效。 :(
关于css - 在输入占位符中为单个字母下划线,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27210066/