1、CSS選擇器
因為每個瀏覽器的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;?
}?
2、textarea風格樣式的代碼,如下:
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {?
color: #636363;?
}?
input:-moz-placeholder, textarea:-moz-placeholder {?
color: #636363;?
}?
3、指定修改哪個input的placehoder屬性,可以使用class
input.addCardInput::-webkit-input-placeholder{
color: #ccc;
}
input.addCardInput:-moz-placeholder{
color: #ccc;
}
input.addCardInput::-moz-placeholder{
color: #ccc;
}
input.addCardInput:-ms-input-placeholder{
color: #ccc;
}
4、在Firefox和IE里,正常input文本顏色覆蓋占位符顏色的方法:
::-webkit-input-placeholder {?
color: red; text-overflow: ellipsis;?
}?
:-moz-placeholder {?
color: #acacac !important; text-overflow: ellipsis;?
}?
::-moz-placeholder {?
color: #acacac !important; text-overflow: ellipsis;?
} /* for the future */?
:-ms-input-placeholder {?
color: #acacac !important; text-overflow: ellipsis;?
}?