Unicode三角形U + 25BA►呈锯齿状？

►有没有办法对这个unicode三角形的边缘应用抗锯齿/平滑处理？Unicode三角形U + 25BA►呈锯齿状？

2013-12-20 Sunny

如果你使用IE浏览器中的过滤器，那么这是不足为奇的。否则，'-webkit-font-smoothing：antialiased;'将有助于在chrome/safari – Deryck

http://jsfiddle.net/rgSB2/ –

根据我的测试，它看起来像最好的办法是使用text-shadow，根据三角形所指向的方向：

text-shadow: 1px 0px 0px rgba(0, 0, 0, .45); // To the right 
text-shadow: -1px 0px 0px rgba(0, 0, 0, .45); // To the left

每个浏览器似乎来处理这是怎样原来有点不同。在Firefox中它几乎没有引人注目，在Safari中它看起来很棒。

我收集了所有不同的技术来试图平滑Web字体到一个地方上的jsfiddle：http://jsfiddle.net/XdP6x/

Example of Unicode Triangle with various CSS faux-anti-aliasing techniques.

虽然我认为的Webkit的text-stroke选项看起来比text-shadow稍微好一点，它不是可以轻松地将这两种技术结合起来，以获得比单独的text-shadow更好的结果。

字体平滑没有做什么，模糊看起来很可怕。我也试过transform:rotate(360deg);没有任何效果。

我还发现除了25BA以外various unicode triangles。并非所有设备和浏览器都支持25C0和25B6，我建议使用25BA和25C4。

或者尝试使用SVG的CSS背景：http://jsfiddle.net/z6hw281a/

2014-07-08 20:10:51 user2449231

回答