如何通过CSS设置“半粗”字体？字体粗细600不会让它看起来像我在Photoshop文件中看到的半粗体

Question

我正在做photoshop到XHTML的转换，网站设计师使用了Myriad Pro半粗体字体，它在photoshop文件中看起来很好，但当我在CSS中尝试半粗体选项时，它看起来很像普通的粗体字体，对我的目的来说太粗体了。有没有办法在HTML和CSS中实现更好看的半粗体字体，或者我只是坚持使用' font -weight: 600;'？

Answer 1

实用的方法是将font-family设置为半粗体版本的特定名称，例如

font-family: "Myriad pro Semibold"

如果这就是名字的话。(就我个人而言，我使用自己的font listing tool，它在Internet和Explorer上运行，只是为了查看我系统中的字体在CSS中可用的名称。)

在这种方法中，不需要font-weight (最好不要设置)。

Web浏览器在实现字体粗细方面一直很差:它们基本上找不到具体的粗体版本，除了粗体。解决方法是将信息包括在字体系列名称中，即使这不是应该如何工作的。

测试Segoe UI，它通常存在于Windows系统的不同字体粗细版本中，当使用逻辑方法(使用字体家族名称Segoe UI和不同的font-weight值)时，我能够让Internet Explorer 9选择正确的版本，但它在Firefox9和Chrome16上失败了(只有正常和粗体的工作)。例如，在所有这些浏览器上，设置font-family: Segoe UI Light都可以正常工作。

Answer 2

在CSS中，对于font-weight属性，值：normal默认为数值400，bold默认为700。

如果要指定其他权重，则需要给出数值。对于您正在使用的字体系列，需要支持该数值。

例如，您可以像这样定义半粗体：

font-weight: 600;

这里是一个使用'Open Sans‘字体家族的JSFiddle，加载了上面的粗细。

Answer 3

对我来说，下面的方法很有效。只需添加它。您可以根据需要对其进行编辑。这只是我使用的一个很好的技巧。

text-shadow : 0 0 0 #your-font-color;