Jak zresetować / usunąć ramkę podświetlenia / ostrości chrome? [duplikat]

Musiałem zrobić wszystkie z następujących rzeczy, aby całkowicie go usunąć:

outline-style: none;
box-shadow: none;
border-color: transparent;

Przykład:

button {
  border-radius: 20px;
  padding: 20px;
}

.no-focusborder:focus {
  outline-style: none;
  box-shadow: none;
  border-color: transparent;
  background-color: black;
  color: white;
}

<p>Click in the white space, then press the "Tab" key.</p>
<button>Button 1 (unchanged)</button>
<button class="no-focusborder">Button 2 (no focus border, custom focus indicator to show focus is present but the unwanted highlight is gone)</button>
<br/><br/><br/><br/><br/><br/>

Aby usunąć domyślną fokus, użyj następujących w domyślnej .plik css:

:focus {outline:none;}

Można następnie kontrolować kolor obramowania ostrości pojedynczo lub domyślnie .css:

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

Oczywiście zastąp red wybranym kodem szesnastkowym.

Możesz również pozostawić obramowanie nietknięte i kontrolować kolor tła (lub obraz), aby podświetlić pole:

:focus {outline:none;background-color:red}

:-)

To na pewno zadziała. Pomarańczowy kontur już się nie pojawi.. Wspólne dla wszystkich tagów:

*:focus {
    outline: none;
   }

Specyficzne dla jakiegoś tagu, np.: input tag

input:focus{
   outline:none;
  }

border:0;
outline:none;
box-shadow:none;

Najprostszym sposobem jest użycie czegoś takiego, ale zauważ, że może to nie być tak dobre.

input {
  outline: none;
}

Można po prostu ustawić outline: none; i obramować innym kolorem na ostrości.

Problem polega na tym, że masz już zarys. Chrome wciąż coś zmienia i to jest prawdziwy ból. Nie mogę znaleźć co zmienić:

.search input {
  outline: .5em solid black;
  width:41%;
  background-color:white;
  border:none;
  font-size:1.4em;
  padding: 0 0.5em 0 0.5em;
  border-radius:3px;
  margin:0;
  height:2em;
}

.search input:focus, .search input:hover {
  outline: .5em solid black !important;
  box-shadow:none;
  border-color:transparent;;
 }

.search button {
  border:none;
  outline: .5em solid black;
  color:white;
  font-size:1.4em;
  padding: 0 0.9em 0 0.9em;
  border-radius: 3px;
  margin:0;
  height:2em;
  background: -webkit-gradient(linear, left top, left bottom, from(#4EB4F8), to(#4198DE));
  background: -webkit-linear-gradient(#4EB4F8, #4198DE);
  background: -moz-linear-gradient(top, #4EB4F8, #4198DE);
  background: -ms-linear-gradient(#4EB4F8, #4198DE);
  background: -o-linear-gradient(#4EB4F8, #4198DE);
  background: linear-gradient(#4EB4F8, #4198DE);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4EB4F8', endColorstr='#4198DE');
  zoom: 1;
}