如何删除<input>边框？

-1

我使用<input>对此我风格的边界：如何删除<input>边框？

input { 
 
    font-size: 300%; 
 
    border-width: 10px; 
 
    border-style: solid; 
 
    border-radius: 30px; 
 
}

<input>

的问题是，一旦<input>具有焦点，会出现一个小小的蓝色边框：

我在DevTools的任何地方都看不到它，所以我认为它属于<input>本身，whi ch不打算有圆形边框（疯狂猜测）

是否有可能摆脱它？

来源

2017-10-11 WoJ

请不要删除'outline'属性 - http://a11yproject.com/posts/never-remove-css-outlines/ – sol

@ovokuro：为什么呢？（这是因为在答案中提到的可访问性？） – WoJ

是的，键盘用户依赖于它提供的反馈。 – sol

您可以用outline:none将其删除，但会创建accessibility issues。

input { 
 
    font-size: 300%; 
 
    border-width: 10px; 
 
    border-style: solid; 
 
    border-radius: 30px; 
 
    outline:none; 
 
}

<input>

2017-10-11 14:40:39

谢谢，我不知道无障碍点（良好的链接）。那么我会保持这样。 – WoJ

应该为你

textarea:focus, input:focus{ 
    outline: none; 
}

工作，但是这已经是在以下链接

2017-10-11 14:41:18

input:focus { 
 
    outline: none; 
 
}

更详细

2017-10-11 14:41:53 vic

回答