字体粗细值无法正常工作

Question

我尝试为文本小部件提供font-weight 属性，但它无法正常工作，这将显示相​​同的值更粗的外观 100,200,300,400 and 500 对600 有很大影响。这是什么问题？我该如何解决？

.flip-menu-text {
    text-align: left;
    font-weight: 100;
    line-height: 1.125rem;
    padding: .5625rem 0;
    margin: 0;
    outline: 0;
    border: 0;
    font-size: 14px;
}

<span class="flip-menu-text">Widgets</span>

Answer 1

这与您提供的 CSS 无关，更多的是与有问题的字体（您没有指定）有关。

以this font 为例。它有 400（普通）、600、700（粗体）、800 和 300 种字体粗细样式。

作为stated by CSS-Tricks:

为了使用 400 或 700 以外的值查看任何效果，所使用的字体必须具有与那些指定的粗细相匹配的内置字体。

简而言之，如果您对可用的font-weight 不满意，请尝试使用其他字体。