html – 为什么IE 11不呈现:在元素之后,在开发工具中显示css被划掉?

我有一个角度应用程序,在给定的屏幕中有两个字体图标.这些在chrome,firefox和edge中渲染得很好,但在IE 11上它们不显示.这些图标将被渲染为:after伪类后的内容,根据我的研究,它应该可以在IE 9及更高版本上正常工作.但是,在IE上,这些根本就不会呈现.

正如您在屏幕截图中看到的那样:after元素不在开发工具中显示的DOM中,并且css是正确的但在开发工具中显示为划掉:

《html – 为什么IE 11不呈现:在元素之后,在开发工具中显示css被划掉?》

在屏幕上编译并实际使用的相关CSS显示问题是这样的:

.profile-picture[_ngcontent-vem-9]:after {
    font-family: Material Icons;
    content: "\E3B0";
    font-size: 48px;
    top: 32px;
    left: 25px
}
.profile-picture[_ngcontent-vem-9] .title[_ngcontent-vem-9],
.profile-picture[_ngcontent-vem-9]:after {
    display: block;
    position: absolute;
    color: #9e9e9e;
    transition-duration: .3s
}

划掉的规则是无关的.但是既然有人要求看到他们,他们在这里:

《html – 为什么IE 11不呈现:在元素之后,在开发工具中显示css被划掉?》

问题是:为什么会发生这种情况,以及如何解决这个问题?

最佳答案 我有一个类似的问题,< a>上的after元素.标签没有在IE11中呈现,虽然我可以看到它的CSS样式.弗雷迪的答案
here为我解决了这个问题.将其添加到css display:block;

点赞