Question

我正在开发一个Web应用程序，我需要在其中显示服务标记字符（℠）。样式表的font-weight为300，用于呈现字符的标记。当以此重量渲染时，服务标记字符似乎变得异常大并且比在相同重量下出现商标字符（TM）时所预期的稍厚。当使用100或200的font-weight时，行为更加明显。

下面是一个演示行为的测试文档。 OS X上的Firefox 12.0上的输出looks like this（对不起，太新了，无法附加图像内联）。无论使用font-family，这种行为似乎都会持续存在。 OS X上的Chrome 19.0.1084.52也显示服务和商标在权重方面存在一些不一致，但效果却不那么明显。

这是Firefox / Gecko的错误，还是我在这里做错了什么？谢谢！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Service Mark Test</title>
    <meta content='text/html; charset=utf-8' http-equiv='Content-type' />
  </head>
  <body style="font-family:sans-serif;">
    <p style="font-weight:normal;">Here is a normal service mark&#8480; and trademark&#8482;</p>
    <p style="font-weight:100;">Here is a weight 100 service mark&#8480; and trademark&#8482; <span style="color:red;">(unexpected)</span></p>
    <p style="font-weight:200;">Here is a weight 200 service mark&#8480; and trademark&#8482; <span style="color:red;">(unexpected)</span></p>
    <p style="font-weight:300;">Here is a weight 300 service mark&#8480; and trademark&#8482; <span style="color:red;">(unexpected)</span></p>
    <p style="font-weight:400;">Here is a weight 400 service mark&#8480; and trademark&#8482;</p>
    <p style="font-weight:500;">Here is a weight 500 service mark&#8480; and trademark&#8482;</p>
    <p style="font-weight:600;">Here is a weight 600 service mark&#8480; and trademark&#8482;</p>
  </body>
</html>

Answer 1

我发现这可能有助于回答你的问题。

http://www.htmlcodetutorial.com/character_famsupp_197.html

如你所见font-weight：100正在推动字体尽可能薄，而400是正常的，700是粗体。

在两者之间可以产生很小的差异，在大多数情况下，100 - 500与大多数字体系列完全相同。

Answer 2

将字体系列设置更改为例如

font-family: Calibri, Arial Unicode MS, Lucida Sans Unicode,
  DejaVu Sans, FreeSans, sans-serif;

这是一个字体问题：当您只使用通用名称sans-serif时，每个浏览器都将使用自己的默认sans serif字体。这通常是Arial，它不包含服务标记字符。浏览器将被迫使用后备字体，Firefox显然使用不同的后备字体用于不同的字体权重 - 这有点奇怪，但肯定是可能的。

上面的列表包含包含服务标记字符的特定字体。大多数字体都只有一两个字体权重，就像大多数字体一样。即使是大胆的版本，例如Arial Unicode MS是“假冒粗体”（算法粗体普通字体），但结果通常是可以忍受的，虽然不是很漂亮。

Firefox不尊重带服务标记字符的font-weight

2 个答案: