Wenn ich meine Eingabe mit Border-Radius fokussiere, erscheint ein quadratischer Rahmen

Question

wenn ich meine Eingabe mit border-radius fokussiere, erscheint ein quadratischer Rahmen.

Kann ich diese zweite Grenze disperieren oder einfach border radius darauf setzen?

input[type="text"]{ 
 
    border: 1px solid red; 
 
    border-radius:10px; 
 
}

<input type="text">

Dies ist der Platz Grenze:

Dank.

Answer 1

Das blaue Rechteck wird als outline referenzierten Sie es über die outline: none Regel verbergen

input[type="text"]{ 
 
    border: 1px solid red; 
 
    border-radius:10px; 
 
} 
 
input[type="text"]:focus{ 
 
    outline: none 
 
}

<input type="text">

Natürlich kann man es Stil kann .. Sehen Sie diese doc geltenden Regeln zu sehen.

Answer 2

Fügen Sie einfach outline:none; zu Ihrem Eingang hinzu.

input[type="text"]{ 
 
    border: 1px solid red; 
 
    border-radius:10px; 
 
    outline:none; 
 
}

<input type="text">

Answer 3

Nur Umriss hinzufügen: 0px none; zu deiner Eingabe.

input[type="text"]{outline:0px none;}