爲什麼IE 11不能渲染：在元素之後，將css顯示爲交叉開發工具？

我在給定的屏幕中有兩個字體圖標的角度應用程序。這些在Chrome，Firefox和Edge中表現得很好，但在IE 11上它們不顯示。這些圖標將被渲染爲:after僞類的content，根據我的研究，該類應該可以在IE 9及更高版本上正常工作。但是，在IE上，這些都不會呈現。爲什麼IE 11不能渲染：在元素之後，將css顯示爲交叉開發工具？

正如你在截圖中看到，在：後元素不在DOM的開發工具顯示，和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 
}

上面劃掉的規則是無關的。不過既然有人問，看到他們，在這裏，他們是：

的問題是：爲什麼會這樣，以及如何解決它？

來源

2017-02-06 Edy Bourne

那麼，您的檢查員的規則上面是什麼？它的屏幕截圖 – Huangism

你試過'font-family：「材質圖標」嗎？這是非常奇怪的字體名稱。我也看到，即使'：after'元素正確顯示，IE仍然會將其規則覆蓋掉，因爲它被其他規則覆蓋（通常它將元素本身的規則顯示爲應用的規則）。 – Justinas

@Justinas即使它是一個奇怪的字體名稱，省略了引號也不是錯誤，並且如果字體不能被使用，則不會發生任何錯誤。所以這不是問題; OP的情況正在發生變化。 –

我有一個類似的問題，<a>標記後元素沒有在IE11中呈現，但我可以看到它的CSS樣式。 Freddie的回答here爲我解決了這個問題。將此添加到css display: block;

來源

2017-06-15 10:23:40 THawkins

爲什麼IE 11不能渲染：在元素之後，將css顯示爲交叉開發工具？

回答

相關問題