复选框 Mozilla 跨浏览器问题

Question

我在 Mozilla 上的复选框遇到了一些问题。复选框（在 http://apespark.com/formifyPro/examples/login.html 上）在 Chrome 上工作得很好，但在 Mozilla 上它看起来像默认复选框。我尝试并添加了 -moz-appeareance: none，但它似乎没有读取伪（::before 和 ::after）元素。我真的不明白为什么它没有按预期显示。

Answer 1

您应该设计标签的样式，而不是输入字段。

label {
    display: inline-block;
    cursor: pointer;
    // your styles here for text.

}
label:before {
    content:"";
    // styles here for the actual checkbox
}
input[type=checkbox] {
    display: none;
}
input[type=checkbox]:checked + label:before {
    content:"";
    // styles here when checkbox is checked
}

为了安全起见，您应该将 html 换成包装标签，就像您拥有的那样

<label><input /></label>

像这样的引用

<input id="myInput" />
<label for="myInput"></label>

问候蒂莫修斯

复选框 Mozilla 跨浏览器问题

Checkboxes Mozilla Cross-Browser issue

html

css

checkbox

mozilla

cross-browser