Html 焦点输入字段上的边框半径

如何调整输入字段焦点的边界半径

HTML

---

使用

：焦点

伪选择器

.rest:focus{
    border-radius:0;
}

---

必须禁用元素焦点状态的轮廓：

*:focus { /*OR .rest:focus*/
    outline:none;
}

这里有一个

---

如果您想在浏览器默认焦点轮廓上使用边框半径，则只能在firefox上使用

-moz outline border:5px，但这仅适用于FF，但是在WebKit中实现类似功能的请求已作为WONTFIX关闭，未来的计划是使轮廓跟随边框。
删除了标准轮廓（不接受边框半径），并使用了蓝色框阴影：


.rest{
边界半径：15px；
边框：1px纯灰；
左侧填充：8px；
}
.休息：专注{
大纲：无；
盒影：0px 0px 2px#0066ff；
}
其他答案涵盖了解决方案，但是，提供的CSS样式无法准确再现蓝环的颜色或大小。例如，替换：

:focus {
    outline: -webkit-focus-ring-color auto 5px;
}

使用所提供的溶液，结果为紫色蓝色
. 相反，请尝试以下颜色：

.rest:focus {
  outline: none; 
  border-radius: 8px;  /* Your border radius here */
  box-shadow: 0px 0px 1px rgba(0,100,255,1),
              0px 0px 2px rgba(0,100,255,1),
              0px 0px 3px rgba(0,100,255,1); /* #0064FF */
}

在输入处于焦点时删除默认轮廓，并添加与输入默认状态的边框半径相匹配的边框

.rest:focus {
   outline: none;
   border: 1px blue solid;
}

它不工作我想更改蓝色浏览器焦点边框半径蓝色边框是浏览器的默认颜色。您希望焦点上的边框采用什么样式？我希望蓝色边框上的边框半径：（@CSSGuy）您正在查找
outline:none
。请尝试
。rest:focus{outline:none}
outline:none，然后添加边框，效果良好谢谢您的帮助我希望浏览器默认蓝色边框上的边框半径：（大纲：无，然后添加边框工作良好感谢您的帮助我编辑了答案，请查看..欢迎您：）
.rest:focus {
  outline: none; 
  border-radius: 8px;  /* Your border radius here */
  box-shadow: 0px 0px 1px rgba(0,100,255,1),
              0px 0px 2px rgba(0,100,255,1),
              0px 0px 3px rgba(0,100,255,1); /* #0064FF */
}

.rest:focus {
   outline: none;
   border: 1px blue solid;
}