-1

enter image description here

when the input button is focused, it's border color will be bule.How to disable it?

Shuai Li
  • 2,426
  • 4
  • 24
  • 43
  • 3
    Possible duplicate of [How to remove the border highlight on an input text element](https://stackoverflow.com/questions/1457849/how-to-remove-the-border-highlight-on-an-input-text-element) – Abk Jan 06 '19 at 07:01

1 Answers1

0

You can use the :focus pseudo-class combined with the outline: 0; property and value.

.input2:focus {
  outline: 0;
}
<input type="text">
<input class="input2" type="text">

As a best practice, you should not remove the focus indicator unless you are adding one of your own back in. In this case, one that wraps the entire search box. Here is an article on the topic.

You might also be interested in the new :focus-visible pseudo-class that can help prevent focus from showing on keyboard clicks of some components such as buttons. Unfortunately, :focus-visible has limited support right now but should see more browsers turning it on in 2019.

Falkicon
  • 103
  • 6