So fügen Sie Rahmen zum Fokus css hinzu

Question

Ich möchte Styling-Eingabe-Textfeld hinzufügen, das einen roten Rahmen hat, wenn geklickt wird und keinen Rahmen, wenn Sie wegklicken. Ich habe versucht, input:active Styling, aber das Problem ist, dass, wenn Sie wegklicken, der rote Rand immer noch da ist. Anstatt input:active ich wan't die input:focus zu manipulieren, wie so eine rote Grenze haben

textarea:focus, input:focus{ 
     outline: none; 
     border: 1px solid red; 
    } 

ist es eine Möglichkeit, dies zu tun?

Answer 1

Gibt es eine Möglichkeit, dies zu tun?

Ja, tun Sie es einfach. Ihre vorgeschlagene CSS-Regeln sind die richtige Wahl, wie durch den folgenden Ausschnitt belegt:

textarea:focus, input:focus { 
 
    outline: none; 
 
    border: 1px solid red; 
 
}

<textarea></textarea> 
 
<input type="text">

Siehe auch How to reset/remove chrome's input highlighting/focus border?