css 修改 input 获得焦点时的边框
起因
写某个站点的搜索页面，准备去掉搜索框获得焦点时的边框时，直接写下面的 css 发现无效
.search:focus{border:none;}
加 !important 也没用
解决方案
搜索了一下 input css 的内容
- 原来边框是
outline带来的 - 如果没有主动设置，很多元素的 outline 是不可见的，也就是默认值为 none
- 但是，input 元素是例外，默认值由浏览器决定
所以
.search:focus{outline:none;}
搞定！