V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member Sign In
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
This topic created in 1462 days ago, the information mentioned may be changed or developed.
最近在学习前端的 css 样式
遇到一个问题，有没有懂哥帮忙产考下。
我写了个输入框，样式是只显示底部 border
但是当输入框鼠标聚焦时，之前隐藏的其它 3 个 border 又显示出来，这个怎么解决？
 |
1
niucility May 6, 2022
修改 input:focus{} ?
|
 |
2
wangtian2020 May 6, 2022
点击 chrome devtools 中元素中的样式中 [:hov] 强制设置元素状态勾选 [:focus] 查看并覆盖重置在聚焦时的输入框样式
|
 |
3
iOCZ May 6, 2022
被 focus 覆盖了？
|
 |
4
pengtdyd May 6, 2022  1
css 请重学一下，谢谢！
|
 |
5
wiluxy May 6, 2022
这个不是 border ，这个是 outline ，还需要设置 outline:none
|
 |
6
shintendo May 6, 2022
这个输入框原来有基本样式和聚焦时样式（用:focus 选择器定义）
你自己写的样式只覆盖了基本样式 |
 |
7
foolenius May 6, 2022
打开浏览器的 Dev Tools => Elements/元素，看看 input 聚焦 focus 之后的 Styles 变化
|
 |
8
QUC062IzY3M1Y6dg May 6, 2022
outline:none
|
Select Language