Html Chrome上的单选按钮显示

我设计了一个单选按钮，使其看起来像一个复选框，其中包含以下内容：

input[name="radio1"] {
-webkit-appearance: checkbox;
-moz-appearance: checkbox;
-ms-appearance: checkbox;     /* not currently supported */
-o-appearance: checkbox;      /* not currently supported */

}

现在，当我在Chrome中访问该页面时，它会用蓝色填充页面，如下所示：

---

有什么想法可以解决吗？

跨浏览器设置这些元素的样式是一种痛苦的经历。我将改为设置标签样式并隐藏默认输入。然后，您可以使用普通CSS以任何方式设置标签的样式

[type=“radio”]{
显示：无；
}
[type=“radio”]+标签：在{
内容：'\2610'；
显示：内联块；
字号：5em；
}
[type=“radio”]：选中+标签：之前{
内容：'\2611'；
}