Css 如何自定义处于不确定状态的复选框的样式？

所以我试图自定义我的复选框，使其看起来像处于不确定状态。检查和未检查的工作正常，但我不能使不确定的正确显示。任何帮助都将不胜感激
我在样式表中尝试了

tag.class:indeterminate{}

和

input[type=checkbox]：indeterminate{}

，但似乎不起作用

---

我的代码和CSS示例：

您应该对

:before

和

:before

和

:after

伪元素执行类似的方法，就像您对

:checked

状态所做的那样

从CSS中删除此部分：

input[type=checkbox]:indeterminate {
    content: "";
    display: block;
    color: white;
    width: 17px;
    height: 17px;
    background-color:#3B99FC;
}

将这些添加到CSS中：

input[type=checkbox]:indeterminate::before {
    content: "";
    display: block;
    color: white;
    width: 17px;
    height: 17px;
    background-color:#3B99FC;
}
input[type=checkbox]:indeterminate::after {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border: solid white;
    border-width: 2px 0 0 0;
    position: absolute;
    top: 9px;
    left: 5px;
}

---

您可以在

input[type=checkbox]：indeterminate:：after

样式内调整不确定状态减号的大小/位置。

谢谢！它起作用了！我不知道不确定也应该有前后。