修改表單元素中placeholder屬性樣式、清除IE瀏覽器中input元素的清除圖標和眼睛圖標

一、修改input元素placeholder屬性樣式

在做項目的時候，一般表單元素的placeholder屬性樣式都是使用瀏覽器默認的，但有時候為了追求設計上的美感需要修表單元素的placeholder樣式（也有可能是遇到了一個處女座的設計師或者是客戶），就不等不修改一下placeholder的樣式。可以通過下面的代碼修改樣式：

/*Chrome、Safari等 webkit內核瀏覽器*/
::-webkit-input-placeholder{
    color:red;
}
            
/*Firefox*/
::-moz-placeholder{
    color:red;
}
            
/*IE、Edge等 Trident 內核瀏覽器*/
:-ms-input-placeholder{
    color:red;
}

 

二、清除IE瀏覽器中input元素的刪除和查看密碼圖標

在IE、Edge等 Trident 內核瀏覽器中，type = “text” 的 input元素中有輸入時會出現清除圖標，type = “password” 的 input元素中有輸入時會出現眼睛圖標。如圖：

         

添加下面的樣式可以去除默認圖標：

::-ms-clear, 
::-ms-reveal{
    display: none;
}