突出显示文本框点击时蓝色

确定一些像Twitter等网站，当你点击textbot登录时突出显示为蓝色。我该怎么做呢？突出显示文本框点击时蓝色

来源

2012-05-18 user1394913

-2

将CSS应用于文本框，如border-color:blue;对click或focus事件。

来源

2012-05-18 23:18:21 Kumar

为什么选择JavaScript而不是纯CSS？ – Helgi

那么如果是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 */ 

}

参考：CSS的

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

来源

2012-05-18 23:19:30 skub

相关位来自Twitter

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); 
}

来源

2012-05-18 23:21:06

检查jsfiddle。您可以通过更换＃56B4EF

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

来源

2012-06-20 01:06:58 Andrew

突出显示文本框点击时蓝色

回答

相关问题