输入控件的outline属性不考虑边框半径

Question

我有一个带有边框半径的输入字段，当它处于焦点位置时，轮廓会出现，但它具有矩形属性。 我正在使用Chrome。 这是错误吗？ 我不想删除轮廓，我只是希望它尊重边界半径。

Answer 1

不幸的是，不可能在所有浏览器中都保留符合边框半径的轮廓。 取而代之的是删除带有outline: 0; 并添加具有CSS焦点的自定义边框或框阴影。

例：

input[type="text"] {
 outline: none;
}   
input[type="text"]:focus {
 box-shadow: 0 0 3px blue;
}

（ http://jsfiddle.net/3cggR/ ）

Answer 2

input[type=text]:focus{
box-shadow: 0px 0px 2px 1px orange;
outline:none;
}