關於input輸入框placeholder屬性的樣式問題

　　正常狀況下，咱們寫的input的默認樣式是這樣的：

　　　　

　　可是開發過程當中，咱們須要實現的效果是這樣的：

　　　　

　　實現方法很簡單，咱們只須要在style樣式裏進行以下設置，同時由於適配問題，整體代碼以下：　　　　　　　

 input:-ms-input-placeholder{ color: #7ed5c4;
        }/* Internet Explorer 10+ */ input::-webkit-input-placeholder{ color: #7ed5c4;
        }/* WebKit browsers */ input::-moz-placeholder{ color: #7ed5c4;
        } /* Mozilla Firefox 19+ */ input:-moz-placeholder{ color: #7ed5c4;
        }/* Mozilla Firefox 4 to 18 */

　　一樣文本域 textarea 也是同樣設置，代碼以下：　　　

 input:-ms-input-placeholder,textarea:-ms-input-placeholder { color: #7ed5c4;
            }/* Internet Explorer 10+ */ input::-webkit-input-placeholder,textarea::-webkit-input-placeholder { color: #7ed5c4;
            }/* WebKit browsers */ input::-moz-placeholder,textarea::-moz-placeholder { color: #7ed5c4;
            } /* Mozilla Firefox 19+ */ input:-moz-placeholder,textarea:-moz-placeholder { color: #7ed5c4;
            }/* Mozilla Firefox 4 to 18 */    

　　除了也顏色，字體大小、粗細等也能夠設置，這裏就不一一列出了，你能夠本身多多嘗試...

 

                                                                                                                                                                                             by： 木梓李