Question

我有以下伪元素：

input[type=radio].selected::before

在互联网资源管理器中，伪元素根本没有显示，所以我决定看一看。我在检查器中找到选择器（检查器中的选择器将是一本很棒的儿童书！）但是所有属性都被打破了。（即被覆盖/无效）。大多数属性不会被其他属性覆盖。这是IE中的默认行为还是这意味着样式根本不起作用，更重要的是，它们为什么不显示？以下是完整的CSS：

input[type=radio]{
    visibility:hidden;  
    cursor: pointer;
    width: 22px;
    height: 22px;
}

input[type=radio]::before{
    content: "";
    display: inline-block;
    visibility: visible;
    width: 16px;
    height: 16px;
    margin-bottom: 0;
    border: 1px solid #ddd;
    -moz-border-radius:8px;
    border-radius:8px;
    font-size: 41px;
    line-height: 18px;
    padding-left: 1px;
    color: #a3a3a3;
}

Answer 1

W3：

：之前和之后：伪元素

作者用。指定生成内容的样式和位置：before和：after伪元素。正如他们的名字所示，：before和：after伪元素指定内容的位置元素的文档树内容之前和之后。内容' property与这些伪元素一起指定了什么插入

换句话说，伪元素只能用于容器元素。这就是为什么它不适用于你的输入元素。

Answer 2

你的问题是如何调试IE中的伪元素，因为我现在没有答案（在Mac atm上）。但是，我可以告诉你：

输入是一个自闭元素（<input />），因此它没有实际内容。例如，图像也是如此。因此，之前或之后都没有添加内容的东西，因为这些伪元素是在元素内容之前/之后插入的（你猜对了）。

长话短说：:: before和:: after不能用于自闭元素。

检查Internet Explorer中的伪元素

2 个答案: