表單之input的樣式修改

修改placeholder字體顏色

html5為input添加了原生的占位符屬性placeholder，高級瀏覽器都支持這個屬性，例如：

<input type="text" placeholder="熱門推薦" value=" ">
默認的placeholder字體顏色是呈淺灰色，如果想改變這個默認顏色，解決方案如下：

input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #f00; 
}

input::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #f00;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
color: #f00;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #f00;
}

 

input上焦點時，去掉焦點框

input{outline:none} 

改變光標顏色而不影響字的顏色

input{caret-color:red;}

也可參考文章：如何改變表單控件光標顏色

input框美化

參考博文：input框focus時的美化效果