CSS中带斜线的字体大小

Posted 2023-03-06

【中文标题】CSS中带斜线的字体大小

【英文标题】：Size of font in CSS with slash

【发布时间】：2010-10-16 15:34:01

【问题描述】：

这里的斜线是什么意思：

font: 100%/120%;

【问题讨论】：

font-size 不接受斜线。正确的属性是font。

这些怎么样？背景：“rgba(0, 0, 0, 0) 无重复滚动 0% 0% / 自动填充框边框框"

【参考方案1】：

这实际上设置了两个属性，相当于：

font-size: 100%;
line-height: 120%;

引用official documentation：

此属性的语法基于传统的印刷简写符号来设置与字体相关的多个属性。

正如 David M 在 cmets 中所说，它反映了将字体大小指定为“x pt on y pt”的排版传统，以表示行高上的字形大小.

但是您问题中的示例实际上是错误的，并且会被浏览器忽略：您只能在 font 简写符号中组合这两个属性，并且您必须至少指定两个属性字体大小和系列。因此，仅仅写font: 100%/120%; 是不够的；您可以添加一个通用姓氏以使其有效，例如：

font: 100%/120% serif;

【讨论】：

这是为了反映旧的排版语法，您可以将字体设置为，例如“10pt on 12pt”或“10pt/12pt”。

我实际上使用了很多。与我一起工作的设计师总是将尺寸称为“14 比 22”。有一天我不小心把它放进去，当它起作用时我很惊讶/很满足。

a quickie：这种格式是否也不需要指定字体系列？我的浏览器忽略了这个属性： font: 12px/16px;但接受这个：字体：12px/16px sans-serif；这种行为也记录在here

@Harsh 是的，font 简写属性至少需要一个族（以及一个大小），正如您在 official definition 中看到的那样。

感谢您的澄清。也许您可以更新答案（或问题），因为它有点误导，因为随便的读者可以假设只有 SIZE/LINE_HEIGHT 声明才有效。

【参考方案2】：

Konrad 得到了这个，但是有很多像这样的CSS shorthand 属性可以用来缩短样式表。如果你不知道的话，其中一些看起来有点神秘。

【讨论】：

尽管大多数简写都处理相关的样式属性（例如border-*）。大卫在 cmets 中对我的回答给出了很好的解释。至于速记是神秘的：当然是正确的，但非常有用且非常容易学习。