Firefox - 从未打开的复选框中删除边框

我有一个复选框，其中有appearance: none;。这在Chrome中工作，但在Firefox中，它留下了一个我无法删除的嵌入边框。我已经试过border: none。Firefox - 从未打开的复选框中删除边框

我在这里提琴：http://jsfiddle.net/jcJJ5/

来源

2012-07-19 trumank

什么是您的文档类型声明？ – Brant 2012-07-19 00:18:25

@Brant <！DOCTYPE html> – trumank 2012-07-19 00:19:29

在复选框规则中不会显示任何内容，可以拿走整个框？ – Brant 2012-07-19 00:19:33

不幸的是，它似乎并没有在设定的复选框的任何属性会有所帮助。

我发现的唯一简单解决方法是将复选框包装在<div>中，并遮住边框。

查看我的Fiddle。

HTML：

<div class="checkbox-container"><input type="checkbox" /></div>

CSS：

input[type="checkbox"] { 
    width: 110px; 
    height: 110px; 
    background: red; 
    -webkit-appearance: none; 
    -moz-appearance: none; 
    appearance: none; 
    border: none; 
    position: relative; 
    left: -5px; 
    top: -5px; 
} 
.checkbox-container { 
    position: absolute; 
    display: inline-block; 
    margin: 20px; 
    width: 100px; 
    height: 100px; 
    overflow: hidden; 
}

顺便说一句，（在Firefox至少），设置background没有任何效果。

来源

2012-07-19 01:09:20

你可以尝试设置-moz-箱阴影：有两行更轻覆盖暗嵌入火狐创建的颜色...

也，我试过打转转的萤火和如果你转动-moz-appearance：none，复选框就完全正常了，并且有一个你不需要玩的普通样式。

来源

2012-07-19 02:36:30

Firefox - 从未打开的复选框中删除边框

回答

相关问题