在Chrome中我有这个CSS:
input::-webkit-input-placeholder{color:blue;}
input:-moz-placeholder{color:blue;}
意识到将其优化为:
input::-webkit-input-placeholder, input:-moz-placeholder{color:blue;}
占位符消失了!为什么会发生这种情况 - 某种错误或什么?
另一个问题是Opera: 'placeholder' in document.createElement('input')返回true。所以这意味着它可用。但它没有显示出来。
输入的其余CSS(如果需要):
input[type=text]{
color: blue;
height: 24px; width: 75px;
padding-left: 24px;
outline: none;
background-color: #ABABAB;
background-image: url('searchtool-1.png');
background-repeat: no-repeat;
-webkit-border-bottom-right-radius: 6px;
-webkit-border-bottom-left-radius: 6px;
-moz-border-radius-bottomright: 6px;
-moz-border-radius-bottomleft: 6px;
border-bottom-right-radius: 6px;
border-bottom-left-radius: 6px;
}
修改:demo
答案 0 :(得分:10)
虽然您可以混合未知的CSS属性,但您不能混合使用不同的未知CSS选择器。如果浏览器看到未知的选择器,它将忽略空洞块。
这是CSS规范。
您还应该使用:: -ms-input-placeholder for IE10。
Opera应支持输入元素中的占位符。你可以小提琴吗?