Html Firefox CSS错误（在Chrome中工作正常）

我遇到了一个问题，下面的代码在Chrome中运行良好，但在Firefox中却不行

DHCP（？）

#客户端控件html{
背景色：#e4ded4；
背景图像：-webkit线性梯度（hsla（0,0%，0%，.1），hsla（0,0%，100%，.1））；
盒影：插入0.100px hsla（0,0%，0%，0.1）；
身高：100%；
}
#客户端控制输入[type=“checkbox”]{
背景图像：-webkit线性梯度（hsla（0,0%，0%，.1），hsla（0,0%，100%，.1）），
-webkit线性梯度（左，#f66 50%，#088A08 50%）；
背景尺寸：100%100%，200%100%；
#背景位置：0,15px0；
边界半径：25px；
盒影：插入0 1px 4px hsla（0,0%，0%，0.5），
插入0.10px hsla（0,0%，0%，0.5），
0.1倍hsla（0,0%，0%，0.1），
0-1px2px2pxHSLA（0,0%，0%，.25），
0.2px2px2pHSLA（0,0%，100%，0.75）；
光标：指针；
高度：30px；
左：0%；
#利润率：-12px-37px；
右边填充：0px；
#位置：左；
最高：50%；
利润率最高：-20%；
左边距：-100px；
宽度：80px；
-webkit外观：无；
-webkit转换：.25s；
对齐：左；
浮动：左；
}
#客户端控制输入[type=“checkbox”]：之后{
背景色：#eee；
背景图像：-webkit线性梯度（hsla（0,0%，100%，.1），hsla（0,0%，0%，.1））；
边界半径：25px；
盒影：插入0 1px 1px 1px hsla（0,0%，100%，1），
插图0-1px 1px 1px hsla（0,0%，0%，.25），
0 1px 3px 1px hsla（0,0%，0%，.5），
0.02×hsla（0,0%，0%，0.25）；
内容：''；
显示：块；
身高：100%；
左：0；
#位置：相对位置；
排名：0；
宽度：25px；
}
#客户端控制输入[type=“checkbox”]：选中{
背景位置：0,80px0；
左侧填充：50px；
文本对齐：左对齐；
内容对齐：左对齐；
右边填充：0；
}

请有人告诉我哪里出了问题，也许还有什么需要改变

PS：此代码用于滑动切换按钮，它以chrome显示，FF仅显示带有阴影背景的复选框。

---

谢谢。

您是否尝试过在有-webkit前缀的地方添加-moz前缀？

当您实际上没有显示任何输出时，不应该添加代码段。仅使用CSS，代码段不会显示任何内容。因此，它是无用的，您应该只使用代码标记，而不是代码段。更好的方法是：使用snippet选项，但添加一些HTML来显示问题。现在我们得猜出哪里出了问题。（但正如答案所示，这可能是由于供应商的前缀，也可能是因为您做了一些奇怪的事情，例如

#position:left

）您的代码示例充满了错误。无论如何，您需要为我们提供一些HTML来配合CSS，让我们了解您试图实现的目标。伪元素不能用于表单输入<代码>#客户端控件输入[type=“checkbox”]：在之后，该行不应在任何浏览器中工作。编辑：您可以将复选框包装在容器中，并在该分区上使用伪元素。大家好，html在上面，我已经更新了主要帖子。所有这些

-webkit-

样式。。。

-webkit-

部分意味着它只在webkit浏览器中工作。Firefox不是Webkit浏览器，因此它们都不能工作。删除

-webkit-

部分，确保您使用的是正确的样式标准格式，您会发现您的代码在所有浏览器中都能更好地工作。看起来它可以工作，只是灰色的切换没有出现。有谁能理解Mike所说的吗？