无法摆脱收音机和复选框中的Firefox焦点显示

我想摆脱Firefox中的蓝色焦点轮廓。当我将大纲设置为0或者没有时，没有任何反应。如果我将轮廓设置为其他内容，则会显示一个单独的轮廓（在该示例中，它是一个正方形的绿色轮廓）。我也尝试使用盒子阴影。但是，如果我尝试删除或修改边框，没有任何反应。（我不能创建一个单独的边框或删除自动轮廓）在这个例子中，我甚至尝试过使用！important的内联样式。当我在Firefox的编辑器中运行代码段时，焦点轮廓立即显示出来。

$(function(){ 
 
    $('#test').focus(); 
 
});

[type=radio]:focus { 
 
     box-shadow:1px 1px 4px red; 
 
     outline:1px solid green; 
 
     border:0 !important; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="radio" name="question-preview2" /> 1<br> 
 
<input id="test" type="radio" name="question-preview2" /> 2<br> 
 
<input style="border:none !important;" type="radio" name="question-preview2" /> 3<br>

编辑： -moz-外观：无;几乎修复它......但是无线仍显得有点不同（有一个下沉式外观）

$(function(){ 
 
    $('#test').focus(); 
 
});

input:focus{-moz-appearance:none;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="test" type="radio" name="question-preview2" /> 1 <- has sunken appearance<br> 
 
<input type="radio" name="question-preview2" /> 2<br> 
 
<input type="radio" name="question-preview2" /> 3<br>

来源

2016-04-22 Luke Wenke

尝试使用:: - MOZ-焦点内，那么就不需要指定：focus伪选择器。这对我有效。

来源

2016-04-22 01:19:02 carl

我刚刚尝试过“:: - moz-focus-inner {outline：none; border：none;}”但它似乎不起作用。您可以将该片段复制到您的答案中进行试用。 –

还有其他非标准的CSS伪选择器，你可以尝试：https://developer.mozilla.org/en-US/docs/Web/CSS/:-moz-focusring 这些选择器的组合应该做的伎俩如果你正确地格式化选择器。例如，在我的原始答案中，选择器需要执行'input :: moz-focus-inner'，然后删除任何轮廓和框阴影。这里也是从上面的选择器链接：https：//css-tricks.com/forums/topic/button-padding-issue/。 – carl

它似乎不可能。 This answer（以及紧随其后的一个）解释为什么它不可能。

来源

2016-04-22 05:55:08

无法摆脱收音机和复选框中的Firefox焦点显示

回答

相关问题