像▶這樣的三角形實體無法在Safari中正確顯示

Question

我打算在我的網站中使用三角形實體▶和◀來表示箭頭。 Chrome OSX在仿真模式下顯示正常。

桌面：

不過，這並不正確，在移動端顯示。

移動：

這是某種形式的默認設置的？我該如何修改？

Answer 1

如果您使用HTML代碼或Unicode十六進制箭頭， 不同的瀏覽器解釋不同的代碼類型，他們有不同的默認設置，所以可能最好的方式來使它工作可能是使用圖像。

Answer 2

我總是用CSS在需要時創建純色三角形：

div.triangle { 
 
    position: relative; 
 
} 
 
div.triangle::after { 
 
    content: ""; 
 
    width: 0; 
 
    height: 0; 
 
    border-width: 10px; 
 
    border-color: transparent red transparent transparent; 
 
    border-style: solid; 
 
    left: 0; 
 
    top: 0; 
 
    position: absolute; 
 
}

<div> 
 
    <div class="triangle"></div> 
 
</div>

只需使用更多的CSS三角形格將根據您的要求。