单选按钮在 IE 和 Firefox 中显示有额外的轮廓答案

【问题标题】：radio button is showing with extra outline in IE and firefox单选按钮在 IE 和 Firefox 中显示有额外的轮廓
【发布时间】：2014-11-24 21:50:07
【问题描述】：

这是我的单选按钮代码

<div class="question">
    <label for="gender" style="display: none">Gender</label>
    <fieldset class="two-radio">
        <legend>Gender</legend>
        <label>
            <input type="radio" id="gender" name="gender" class="radioInput" 
                ng-model="namedInsured.gender" value="Male" required> Male
        </label>
        <label>
            <input type="radio" id="gender" name="gender" class="radioInput" 
                ng-model="namedInsured.gender" value="Female" required> Female
        </label>
    </fieldset>
</div>

它在 chrome 中可以正常工作，但对于 IE，当您选择单选按钮时，它会显示虚线轮廓，而在 Firefox 中，它会显示轮廓，但在转到下一个元素后它不会。我在同一页面中也有其他单选按钮有同样的问题。那么任何人都可以帮助我删除这些轮廓吗？提前感谢您的宝贵时间

【问题讨论】：

你试过outline属性CSSW3Schools Outline
@Billy 我试过轮廓颜色：#ffffff;但那也不好用

标签： html css internet-explorer firefox

【解决方案1】：

Chromium 为重点元素添加了轮廓，甚至对 div 之类的元素进行分组......我很惊讶它发生在 IE 和 Gecko 而不是 webkit......

您的样式表必须使用 -webkit 前缀......（使用 webkit 开发工具来跟踪元素的样式规则......任何带有 -webkit- 前缀的东西都是 webkit 浏览器专有的。

要删除焦点元素的轮廓，请使用

*:focus{outline:none}

在你的引导 css 中。

【讨论】：

我试过了。不工作。也许你能建议我确切的地方，可能是我把它放在错误的地方的原因

【解决方案2】：

我得到了答案。所以问题出在 Firefox 中是轮廓，而在 IE 中是边框。

所以为了删除两者，我必须放

边框：无；大纲：无；在我的样式表和 vola 中...一切正常。

【讨论】：