Css 当文本框聚焦时，如何使其变亮？

当文本框处于聚焦状态时，如何产生明亮的效果

的登录页面已经实现了亮显文本框

我想知道如何实施它

有什么想法吗？纯CSS？或者使用一些javascript来处理焦点事件和addClass removeClass

---

我更喜欢用jQuery实现javascript，而不是用纯javascript实现：）

因为你的问题是用jQuery标记的，并且考虑捕捉焦点事件，那么：

$("#yourTb").focus(function(){
    $(this).css("background-color", "yellow");
});

只是别忘了：

$("#yourTb").blur(function () {
    $(this).css("background-color", "white");
});

---

Twitter通过一个简单的CSS3框阴影来实现这一点：

input:focus {
    box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 0 10px rgba(255, 255, 255, 0.9)
}

---

聚焦元素时，不需要Javascript来处理样式更改。

您还可以在文本框的onFocus事件上编写函数。在该函数中，只需更改textfield的css类。像这样的东西

function change（）{//code更改类}

---

希望这能有所帮助。

这可以在CSS中完成，而不需要任何Javascript，更不用说jQuery了。@Interrobang-是的，可以完成，但是这个问题是用jQuery标记的，所以这并不是一个不合适的答案。这并不能使它变得更正确。Javascript不仅对解决方案很苛刻，而且您现在正在将表示风格混合到业务逻辑中。至少，jQuery可以用来切换一个类，而不是盲目地设置CSS属性。@Interrobang-因此，使用jQuery根据焦点和模糊设置CSS属性是

将表现风格混入业务逻辑中的一种做法。我想很明显你不知道你在说什么。此外，您可能会向OP提到：focus选择器在IE7及以下版本中不受支持。这可能是相关的，也可能不是相关的，这就是为什么你不应该盲目地使用它：）加入你自己的风格——我只是向你展示Twitter是如何使用CSS:focus选择器来做这件事的。你用哪个浏览器来测试？请注意，为了正常工作，它需要一个现代浏览器（不是IE6到IE8），您可以微调上述样式定义中的颜色（rgb）以适应您的视觉偏好。但一般来说，这是实现你所要求的最合适的方式。如果你只想强调文本框的方式，考虑一些类似“代码>边框：1PX StRed Red 或类似的内容。只有你知道什么会让你的网站看起来最好：）