css字体规则中的“normalnormalmedium45px/61pxOswald”是什么意思？
我正在将 Adobe Xd 中的设计转换为 HTML 模板，其中一个元素建议使用以下 css 规则。
top: 149px;
left: 54px;
width: 463px;
height: 208px;
text-align: left;
font: normal normal medium 45px/61px Oswald;
letter-spacing: 0px;
color: #FFFFFF;
text-transform: uppercase;
opacity: 1;
顺便说一句，我熟悉类似的字体速记font: italic small-caps bold 12px/30px Georgia, serif;，它也可以使用，但是 Xd 建议的这种新格式是什么？甚至 Chrome 也发现它是invalid.
回答
该font属性的速记语法转换为：
font: font-style font-variant font-weight font-size/line-height font-family;
所以生成的代码相当于：
/* font: normal normal medium 45px/61px Oswald; */
font-style: normal;
font-variant: normal;
font-weight: medium;
font-size: 45px;
line-height: 61px;
font-family: Oswald;
这里的无效属性是font-weight，它不能接受“中等”作为值。"Medium" 是一个 OpenType 值，大致对应于font-weight: 500，但不是有效的 CSS 值。
这是一种有用的调试技术，供将来参考：如果您invalid property value在使用 CSS 速记时遇到错误，将速记属性重写为单独的属性会很有帮助，这样浏览器的开发工具就可以准确指出哪个属性具有无效值。
THE END
二维码