css - Unicode 三 Angular 形 U+25BA ► 出现锯齿状？

Question

► 有没有办法对这个 unicode 三 Angular 形的边缘应用抗锯齿/平滑处理？

Answer 1

根据我的测试，最好的选择是使用 text-shadow，具体取决于三 Angular 形指向的方向:

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 中它看起来棒极了。

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

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

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

我还找到了various unicode triangles除了 25BA。并非所有设备和浏览器似乎都支持 25C0 和 25B6，我建议使用 25BA 和 25C4。

--

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