ウェブページで現在選択されているフィールドのスタイルを設定する方法

Question

Chromeブラウザは、現在選択されている入力要素の周りにオレンジ色のハイライト表示をします。

Answer 1

私はそれがだと思う：

.myInput:focus /*or # depending*/ 
{ 
    outline: #f00; /*or outline: none;*/ 
} 

私はを考える。

Answer 2

outline: 0またはoutline: noneで無効にすることができます。

outline-color: red（または他の色）で色を変更することもできます。

Answer 3

選択した入力を右クリックして[要素の検査]を選択すると、デフォルトで適用されるスタイルが表示されます。右側のスタイルタブでユーザーエージェントスタイルシートを探します。これは、関連するビットです：

Answer 4

でとりうるレイアウト：

:focus{ 
    outline-color:white; 
} 
[required]{ 
    border-color: #FFF; 
    -webkit-box-shadow: 0 0 3px rgba(51, 153, 255, .5); 
} 
:invalid { 
    border-color: #606077; 
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .8); 
}