Html 如何在输入中仅使用占位符斜体
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27644314/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make only placeholder italics in input
提问by prabin badyakar
Hi can any one tell me how can i make only placeholder italics but when someone writes inside a test box , written word shouldnt have italics.
嗨,任何人都可以告诉我如何只制作占位符斜体,但是当有人在测试框内书写时,文字不应该有斜体。
MyCode:
我的代码:
<input type="text" id="search" placeholder="Search" style="font-style:italic">
How can i place italic on only placeholder not whole input???
如何仅在占位符而不是整个输入上放置斜体???
回答by Joseph Marikle
Sure. Just apply the style to these CSS rules:
当然。只需将样式应用于这些 CSS 规则:
::-webkit-input-placeholder {
font-style: italic;
}
:-moz-placeholder {
font-style: italic;
}
::-moz-placeholder {
font-style: italic;
}
:-ms-input-placeholder {
font-style: italic;
}
Probably not all of these rules are needed. I always just reference CSS Tricksbecause I always forget how to do it.
可能不需要所有这些规则。我总是只引用CSS Tricks,因为我总是忘记如何去做。
Edit:Note that these rules cannot be combined into one selector. They must be declared separately as noted by Dave Kennedyin the comments below.
编辑:请注意,这些规则不能合并为一个选择器。正如Dave Kennedy在下面的评论中所指出的,它们必须单独声明。
回答by Mike Aron
Another way: the :focus selector is your friend. To make it only for the placeholder use the :not selector. This have the CSS rule only if the input field is NOT current selection. Define in your CSS :
另一种方式: :focus 选择器是你的朋友。要使其仅用于占位符,请使用 :not 选择器。仅当输入字段不是当前选择时才具有 CSS 规则。在你的 CSS 中定义:
.class-of-your-input-field:not(:focus) {
font-style:italic;
}