数字不使用 css 大写（谷歌字体）答案

【问题标题】：Numbers do not uppercase with css (google fonts)数字不使用 css 大写（谷歌字体）
【发布时间】：2020-01-19 04:11:03
【问题描述】：

Google 字体上的 Playfair 显示有问题。在这里，我在此页面底部的 Playfair 显示屏上进行了倒计时：http://pms-ops.com/revlon/2019/

字体编号大小写不同。即使我把 css 写成大写，数字仍然是小写。

我添加了一些代码来解决我的问题（主要是在桌面上）。但是移动部分是小写的。我尝试了很多东西，但我无法修复它。

text-transform:capitalize;
-moz-font-feature-settings:"lnum";
-webkit-font-feature-settings:"lnum";
font-feature-settings:"lnum";
font-variant-numeric:lining-nums;

这不起作用，仅适用于桌面，并且不适用于所有浏览器。

【问题讨论】：

你能提供一个“小写和大写的区别”的例子吗？ IE。带有屏幕截图或类似的东西。
没有小写或大写数字之类的东西。 fonts.google.com/specimen/Playfair+Display 下显示的字符列表似乎也只有一个“组”数字。不清楚你在这里问什么。
术语“大写”和“小写”有时确实适用于数字，在这种情况下，它们的含义与其他使用的术语“衬里”和“旧样式”相同。 Michael Deleau 在答案中提供的这张图片正确地说明了差异。

标签： css fonts numbers numeric uppercase

【解决方案1】：

欣赏这是旧的，但认为有人可能想在这里找到答案。

您所指的数字样式称为表列数字。

并非所有字体都有它们，据我所知，Playfair 的 Google 字体版本不包含 Opentype 功能。也就是说，我可以在原来的 Playfair Display Opentype 字体上看到它们，如果你在这里查看“数字”部分； https://beautifulwebtype.com/playfair-display/你会看到他们的。

据我所知，您需要嵌入 woff2 字体文件 (https://github.com/clauseggers/Playfair-Display/tree/master/fonts/WOFF2) 才能在 CSS 中使用它们以及以下样式；

font-family: 'Playfair Display SC'; font-feature-settings: 'lnum', 'pnum';

祝你好运。

【讨论】：

【解决方案2】：

这里是大写的数字。

这里是小写的数字。

【讨论】：