Question

如何在输入聚焦时删除显示的单选按钮周围的小方块？

enter image description here

我很确定这是重复的，但我不知道这个方块实际上是什么，也找不到我要找的东西。

我在输入上尝试了autocomplete="off"。我使用jQuery的preventDefault玩了很多但没有成功。

更新：谢谢你的回复。如果有人遇到这个问题，那么appearance附加的效果（上面的图片没有外观，下面的图片就是外观）与Firefox：

enter image description here

以防有人遇到同样的问题。

使用Chrome / Safari进行

更新，appearance 删除输入

-webkit-appearance: none;会使单选按钮消失 Chrome和Safari。检查jsfiddle.net/8uY6H（使用Chrome）

- 由JFK 6指出

Answer 1

尝试这个CSS，因为它是一个大纲：

input[type="radio"]:focus {
    outline:none;
}

Answer 2

尝试焦点单选按钮的outline:0属性

input[type="radio"]:focus{
    outline:0;
}

Answer 3

您需要设置：

outline:none;

在与复选框相关的CSS类的:focus状态，或直接例如。

input[type="radio"]:focus{
    outline:none;
}

CSS outline属性是设置一个或的简写属性更多的个别轮廓属性轮廓样式，轮廓宽度和单一规则中的轮廓颜色。在大多数情况下使用这个捷径更可取，也更方便。

However, also setting appearance may help cross platform ，其中不同的浏览器以不同方式呈现复选框元素。

如下面的评论中所述，这将导致复选框在某些情况下不显示 - 因此您需要生成纯CSS解决方案。

-moz-appearance CSS属性用于Gecko（Firefox）显示   使用基于操作的平台本机样式的元素   系统的主题。

此属性经常在XUL样式表中用于设计自定义   具有平台适当样式的小部件。它也用于XBL   随Mozilla平台一起提供的小部件的实现。

Answer 4

就像

一样简单

input[type="radio"] {
    outline: 0 none;
}