html - CSS中的粗体字体

Question

我有一个练习来做类似 H&M类似的事情。但是排版看起来不一样，无论是在图像内部还是外部。这是我的完整代码

https://codesandbox.io/s/sparkling-night-b499r

我在我的css中试过这个

body {
  background-color: #faf9f8;
  font-family: "Didact Gothic", sans-serif;
  font-weight: bold;
}
.navbar div {
  list-style-type: none;
  display: flex;
  margin: 20px;
  opacity: 0.6;
}
.ontop-image {
  display: flex;
  list-style-type: none;
  justify-content: center;
  opacity: 0.6;
}

但它没有做这项工作。

因此，如果有人能告诉我为什么粗体字体看起来不正确，那就太好了。

谢谢阅读

标签： htmlcss

Answer 1

这并没有呈现您认为的样子，因为您正在加载的字体没有粗体的排版样式。所以它被赋予了一种自动的粗体风格，看起来从来没有那么好。

您可以在 Google Fonts 上看到，它们唯一可用的格式是常规格式：

我建议您寻找具有更多格式的类似字体，例如Nunito看起来非常相似并且具有大量字体粗细。