使小字体更大胆

Question

我想知道是否有人使用智能js或css技巧来使小字体变得更大胆。

对于客户端，我们使用Courier字体，字体大小为12px / 15px，text-transform为大写。我在文本中添加了font-weight bolder，但文本仍然不像Photoshop设计文件中那样粗体。

有没有人知道让小字体显得更大胆的任何技巧？

我目前的CSS：

.block.project p {
    font-family: "Courier New",Courier,monospace;
    font-size: 12px;
    line-height: 15px;
    font-weight: bolder;
}

我尝试用文字阴影执行一些技巧，但这并不能产生满意的效果。

提前致谢！

Answer 1

您可以使用与字体颜色相同的颜色阴影来尝试使用字体阴影。

以下其中一项可能会这样做：

为每条边添加模糊字体阴影

text-shadow: 0px 0px 1px #000000;

或者在每个字母的垂直厚度上添加一个像素

text-shadow: 0px 1px 0px #000000;

或者在每个字母的水平粗细中添加一个像素

text-shadow: 1px 0px 0px #000000;

我认为其中第二个是我个人的偏好。

然而，CSS3并不保证支持（虽然我相信这是支持更好的功能之一）并且可能会降低可读性。

Find a generator here

Answer 2

尝试设置font-weight: 900; - 这是font-weight的最大值。 如果没有帮助，请尝试增加font-size;。

此外，Photoshop和浏览器正在使用不同的渲染模型，这就是差异始终存在的原因。