焦点环画在圆角外会露出四角
怎么认出来
- 现象集中在四角,不是整条边 —— 圆角处 ring 与边框之间露出的面积最大。
- 只在聚焦时出现(点进输入框编辑时才看到)。
- 追溯来源是继承的通用样式,不是这个组件自己写的边框。
做法
只改出问题的那一个输入框(例:简历名称):
保留蓝色边框
focus-visible:ring-0 去掉外圈 ring
不动通用 Input —— 否则会影响其它表单输入框的聚焦反馈。
相关
- 样式丢失先核对类名再怀疑缓存与权限 —— 同源:先确认是哪个样式在生效,再怀疑环境
- 讲bug先讲现象再讲根因 —— 沟通侧:先说"四角有蓝影",再说 ring
- 控件参数要在下游被消费 —— 同一天、同一编辑器的另一处"样式看起来不对"
- 折叠动画要有收起态过渡 —— 同一天同一编辑器的另一处「通用组件默认行为」问题
- 可调与固定的边界按语义划分 —— 同源:改动要落在正确的那一层(单个输入框 vs 通用组件)