How To Remove Outline Border From Input Button

Question

when click somewhere else the border disappears, tried onfocus none, but didn\'t help, how to make ugly button border disappear when click on?

相关标签:

Answer 1

It's greatly simple than you think. When the button is focussed, apply the outline property, like this:

button:focus {
    outline: 0 !important;
}

But when I use none value, it doesn't work for me.

Answer 2

Removing nessorry accessible event not a good idea in up to standard web developments. either way if you looking for a solution removing just the outline doesn't solve the problem. you also have to remove the blue color shadow. for specific scenarios use a separate class name to isolate the this special style to your button.

.btn.focus, .btn:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, .25);
}

Better do this

.remove-border.focus, .remove-border:focus {
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, .25);
 }