我从网站上获取了一些 CSS，虽然我对基本 CSS 有很好的理解，但我不理解这里的所有样式/属性:
font: normal normal bold 36px/54px brandon-grotesque-n7, brandon-grotesque, sans-serif;
一些额外的上下文 - 这是 Logo 的 CSS，您可以在 JS Fiddle 中看到它。 。
具体来说，我很好奇:
- 为什么显示“正常正常粗体”？
- 为什么字体大小上有斜线？
- 为什么列出了三种字体类型？
最佳答案
您看到的是一个速记字体声明。它本质上与编写以下内容相同:
font-family: brandon-grotesque-n7, brandon-grotesque, sans-serif;
font-size: 36px;
font-style: normal;
font-variant: normal;
font-weight: normal;
line-height: 54px;
为什么显示“正常正常粗体”？
这是字体样式，然后是字体变体，然后是字体粗细。另一个例子是斜体小型大写粗体。
为什么字体大小上有斜杠？
这是字体大小后跟行高。在您的示例中，字体大小为 36px，行高为 54px。
为什么列出了三种字体类型？
这称为字体堆栈。浏览器将尝试按照这些字体的书写顺序使用它们。如果 brandon-grotesque-n7 在用户系统上不可用，浏览器将回退到使用 brandon-grotesque。如果不可用，它将使用系统默认的 sans-serif 字体。
有用的字体速记备忘单:
备忘单来源:http://www.impressivewebs.com/css-font-shorthand-property-cheat-sheet/
关于css - 这些 CSS 字体属性意味着什么？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25571729/