jquery - 青色のクリック時にテキストボックスを強調表示する

Question

わかりましたので、テキストボットをクリックしてログインすると、Twitter などの一部の Web サイトが青色で強調表示されます。どうすればいいですか？

Answer 1

Twitterの場合は、bootstrap.cssコードを確認できます。私は次のcssがトリックを行うと思います（bootstrap.cssからそれを取り出しました）：

input:focus, textarea:focus {
  border-color: rgba(82, 168, 236, 0.8);
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
  outline: 0;
  outline: thin dotted \9;
  /* IE6-9 */

}

参照：

• http://twitter.github.com/bootstrap/

Answer 2

このjsfiddleを確認してください。＃56B4EFを交換することで色を変えることができます

 input:focus {
 outline: none;
 box-shadow: 0px 0px 7px #56B4EF;
 border-color: #56B4EF;

Answer 3

関連する Twitter の CSS のビット

textarea {
    border: 1px solid #ccc;
    border-radius: 4px;
    outline: none;
}

textarea:focus {
    border-color: #56B4EF;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.05),0 0 8px rgba(82,168,236,.6);
    -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.05),0 0 8px rgba(82,168,236,.6);
}​

Answer 4

border-color:blue;onclickやfocuseventなどのテキストボックスにCSSを適用します。