css @字体粗细仅工作粗体---字体粗细：600---

0wi1tuuw 于 2022-12-05 发布在其他

关注(0)|答案(3)|浏览(226)

字体系列正在运行。但字体粗细不正常。例如，我添加了字体粗细：400或100等到h3-h4等它不工作。只有一个字体粗细工作正常，它的字体粗细：600我完全完成了，我研究了两天，我问我的朋友，但我的问题仍然在这里。我认为我的@字体脸的设置是正确的。但我不知道..请任何人可以帮助我？

@font-face {
  font-family: "Gotham Narrow";
  src: local("../font/gothamnarrow-thin-webfont.woff2") format("woff2"),
    local("../font/gothamnarrow-thin-webfont.woff") format("woff");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: local("../font/gothamnarrow-light-webfont.woff2") format("woff2"),
    local("../font/gothamnarrow-light-webfont.woff") format("woff");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: local("../font/gothamnarrow-book-webfont.woff2") format("woff2"),
    local("../font/gothamnarrow-book-webfont.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: local("../font/gothamnarrow-medium-webfont.woff2") format("woff2"),
    local("../font/gothamnarrow-medium-webfont.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: local("../font/gothamnarrow-bold-webfont.woff2") format("woff2"),
    local("../font/gothamnarrow-bold-webfont.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Gotham Narrow";
  src: local("../font/gothamnarrow-ultra-webfont.woff2") format("woff2"),
    local("../font/gothamnarrow-ultra-webfont.woff") format("woff");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: local("../font/gothamnarrow-black-webfont.woff2") format("woff2"),
    local("../font/gothamnarrow-black-webfont.woff") format("woff");
  font-weight: 900;
  font-style: normal;
}

css

来源：https://stackoverflow.com/questions/74662528/font-weight-only-working-bold-font-weight600

3条答案

按热度按时间

c9x0cxw01#

你能试试src：url（“...”）而不是本地：而woff并不是真的需要，因为所有支持woff的浏览器也都支持woff2...

@font-face {
  font-family: "Gotham Narrow";
  src: url("../font/gothamnarrow-thin-webfont.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
}

赞(0）回复(0）举报 2022-12-05

5gfr0r5j2#

好的，如果谷歌字体也不起作用，请试试？

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1xlFQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

赞(0）回复(0）举报 2022-12-05

kkbh8khc3#

首先我的字体文件有问题，一些字符显示不正确。所以我下载字体另一个网站，现在好了。其次，必须是url（）而不是local（）

@font-face {
  font-family: "Gotham Narrow";
  src: url("../font/GothamNarrow-Thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: url("../font/GothamNarrow-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: url("../font/GothamNarrow-Book.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: url("../font/GothamNarrow-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: url("../font/GothamNarrow-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Gotham Narrow";
  src: url("../font/GothamNarrow-Black.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: "Gotham Narrow";
  src: url("../font/GothamNarrow-Ultra.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
}

赞(0）回复(0）举报 2022-12-05

我来回答

css @字体粗细仅工作粗体---字体粗细：600---

3条答案

相关问题

热门标签

最新问答