如何添加边框以聚焦css

Posted 2023-03-06

【中文标题】如何添加边框以聚焦css

【英文标题】：How to add border to focus css

【发布时间】：2017-10-22 19:19:15

【问题描述】：

我想添加样式输入文本框，单击时有红色边框，单击离开时没有边框。 我尝试过设置input:active 的样式，但问题是当您点击离开时，红色边框仍然存在。而不是input:active 我不想操纵input:focus 来拥有像这样的红色边框

 textarea:focus, input:focus
        outline: none; 
        border: 1px solid red;
  

有没有办法做到这一点？

【参考方案1】：

有没有办法做到这一点？

是的，就去做吧。您建议的 CSS 规则是正确的选择，如下 sn-p 所示：

textarea:focus, input:focus 
  outline: none; 
  border: 1px solid red;

<textarea></textarea>
<input type="text">

另见How to reset / remove chrome's input highlighting / focus border?

【讨论】：

我明白了。我认为样式焦点是一个问题，但我认为我有一些相互冲突的类，导致它第一次无法工作。

如果您认为这已经解决了您的问题，您应该将此答案标记为已接受（单击向下投票按钮下方的灰色复选框）