設置placeholder無效解決辦法

一、設置placeholder的方法

placeholder屬性用來設置控件內部的提示信息

<input type="text" placeholder="請輸入用戶名">

　　

改變placeholder的樣式：

input::placeholder {
    color: red;
    font-size: 22px;
}

　　

二、各瀏覽器樣式兼容設置

1、針對谷歌瀏覽器的設置方式：

input::-webkit-input-placeholder {
    color: red;
    font-size: 22px;
}

 

2、針對火狐瀏覽器的設置方式：

input::-moz-placeholder {
    color: red;
    font-size: 22px;
}

 

3、針對IE瀏覽器的設置方式：

input:-ms-input-placeholder {
    color: red;
    font-size: 22px;
}

　　

三、設置placeholder的樣式無效--解決方法

設置placeholder方法無效的原因：

如果在某些公共樣式中，已經對placeholder的樣式進行了設置，再次對placeholder的樣式進行設置時，就會無效，

解決方法是，給樣式加 !important; 增加權重即可。