如何设置超薄“字体粗细” （小于100）在CSS中？ [英] How to set super thin "font-weight" (less than 100) in CSS?

问题描述

我想使文本超薄，小于

font-weight: 100

是否可能与CSS有关？

Is that possible to do with CSS?

类似，但带有helvetica：

Like this but with helvetica:

推荐答案

在处理Web字体时，CSS字体粗细不会使字体变细（或粗体）。对于未从URL加载的字体， font-weight 值从超薄映射为超粗体，但是对于自定义字体，其权重为无论@ font-face绑定如何说应该是：它们只是声明具有多个权重的字体系列时使用的微分数字。

CSS font weights do not "make fonts thin" (or bold) when dealing with web fonts. For not-loaded-from-url fonts the font-weight value maps from ultra thin to extra bold, but for custom fonts the weight is "whatever the @font-face binding says it should be": they are merely differentiation numbers used when declaring a font family with multiple weights.

以下是使用三个权重的Web字体的CSS声明。 ，但仔细查看字体资源与字体粗细：

The following is a CSS declaration for a web font that uses three weightss, but have a close look at font resource vs. font weight:

@font-face {
  font-family: "Helvetica Neue";
  font-weight: 800;
  src: url(helveticaneue-ultrathin.woff);
}

@font-face {
  font-family: "Helvetica Neue";
  font-weight: 400;
  src: url(helveticaneue-regular.woff);
}

@font-face {
  font-family: "Helvetica Neue";
  font-weight: 100;
  src: url(helveticaneue-ultrathin.woff);
}

这为我们提供了一个CSS声明的字体家族，具有三个定义的权重（使用100、400或800以外的其他值将导致不确定的行为）。现在其中两个权重指向相同的字体资源。

This gives us one CSS-declared font family, with three defined weights (using value other than 100, 400, or 800, will lead to undefined behaviour). Now two of those weights point to the same font resource.

以下代码将使用超薄字体设置文本样式，即使CSS使用粗细800，对于预定义的字体通常表示该死的粗体：

The following code will style text using the ultrathin font, even though the CSS uses weight 800, which for predefined fonts normally means "pretty damn bold":

<p style="font-family: 'Helvetica Neue'; font-weight:800">This is thin!</p>

因此，如果您想使用超级双面字体，那就去吧。但这与CSS font-weight值无关，与 you 值有关的所有事情都在其@ font-face规则中进行分配，然后在您的font-using-CSS中使用。

So if you want to use a superduper thin font: go for it. But that has nothing to do with the CSS font-weight value, and everything to do with the value you assign it in its @font-face rule, and then use in your font-using-CSS.

这篇关于如何设置超薄“字体粗细” （小于100）在CSS中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！