css在不同的輸入類別

Question

你好，我有以下問題：

我檢查我的表單中的一些PHP錯誤消息。

中沒有錯誤的情況下，我只是有我的CSS設置：

.wrapper #frame form fieldset ul input { 
    color: #f23; 
    font-size: 10px; 
    height: 18px; 
    padding-left: 5px; 
    margin-top: 3px; 
    outline:none; 
} 

和我的焦點設置：

.wrapper #frame form fieldset ul input:focus{ 
    color:#fff; 
    font-weight: bold; 
    border: 2px solid #fff; 
} 

好了，現在我改變了這一行：

<input type="text" id="normal" name="1" value=""/> 

加上錯誤類別：

<input class="err" type="text" id="normal" name="1" value=""/> 

的問題是，我的設置只是把地方上的輸入字段我的課的細節，但不是我的焦點設置：

.err { 
    color: #444444; 
    font-size: 10px; 
    width: 180px; 
    height: 18px; 
    padding-left: 5px; 
    outline:none; 
    background-image: url(../images/error.png); 
} 
.err input:focus{ 
    color:#f23; 
    font-weight: bold; 
    border: 2px solid #f23; 
} 

所以如果有一個人誰可以告訴我爲什麼，這並不工作，我真的很感激。非常感謝。

Answer 1

您的HTML中有一類error，在您的CSS中，您已將該類設置爲err;如果您始終使用相同的名稱（無論您選擇哪個），它應該可以工作。

您當前 HTML：

<input class="error" type="text" id="normal" name="1" value=""/> 

...和CSS：

.err { 
    color: #444444; 
    font-size: 10px; 
    width: 180px; 
    height: 18px; 
    padding-left: 5px; 
    outline:none; 
    background-image: url(../images/error.png); 
} 
.err input:focus{ 
    color:#f23; 
    font-weight: bold; 
    border: 2px solid #f23; 
} 

而且，在你的CSS你選擇input這是一個元素的後代與err班級名稱，而不是input元素與表示班級名稱。所以，你應該使用類似的東西：

<input class="err" type="text" id="normal" name="1" value=""/> 

input.err { 
    color: #444444; 
    font-size: 10px; 
    width: 180px; 
    height: 18px; 
    padding-left: 5px; 
    outline:none; 
    background-image: url(../images/error.png); 
} 
input.err:focus{ 
    color:#f23; 
    font-weight: bold; 
    border: 2px solid #f23; 
}