css內容字符渲染奇怪

我使用：after僞元素在列表中的每個項目旁邊添加一個字符。我目前使用的CSS是：css內容字符渲染奇怪

li:after { 
     display: inline-block; 
     content: '\25b6'; 
     color: #dc313a; 
     padding-right: 16px; 
     padding-left: 6px; 
     font-weight: normal; 
}

它在Chrome（大多數情況下），Firefox和IE11中顯示效果很好。這是它應該添加到每個li元素的末尾：

在Chrome中，有時會顯示此，按F5將會修復它。

在邊沿是在某些計算機

顯示此

有誰知道爲什麼我有時會在Chrome那些字符，爲什麼邊緣顯示的東西，在某些計算機完全不同的？

來源

2017-06-02 David

不同的瀏覽器可以有自己的unicode字符渲染實現。你有沒有嘗試設置一個Unicode字體，所以它不使用瀏覽器默認？（關於邊緣問題） –

@FelixGuo我得到了： font-family：Arial; font-size：10pt; 分配在身體上。我試圖直接將字體和大小規格複製到li中：在部分css之後，它沒有任何區別。 – David

試試這個：https：//stackoverflow.com/questions/32915485/how-to-prevent-unicode-characters-from-rendering-as-emoji-in-html-from-javascrip –

儘管許多網站認爲字符25b6在所有瀏覽器中都不起作用。在Windows中查看Ariel字體的字符映射後，我發現25ba也給出了相同的字符（足夠接近）。用25ba而不是25b6更新我的css後，它可以正確顯示我可以測試的所有瀏覽器。

看起來，25b6邊緣只是將其更改爲一個表情符號，甚至添加fe0e後，它不會停止改變它。

來源

2017-06-02 18:12:10 David

css內容字符渲染奇怪

回答

相關問題