Safari 的 HTML 输入字体系列样式

Question

我有一些 CSS 用于在表格中输入文本。

input.login-form__username {
  -webkit-appearance: none;
  font-family: "Poppins-Regular";
  width: 20vw;
}

由于某种原因，

font-family

在 macOS 上的 Safari 中无法正常工作。它仍然以苹果操作系统字体显示输入框。这在 Chrome 和其他浏览器中可以正常工作，但在 Safari 中不行。

我是否缺少一些可以让它发挥作用的东西？

Answer 1

你应该看到这个链接，有些字体不能像你说的那样在 safari 上工作，要解决这个问题，你可以添加另一个在 safari 上工作的相同字体，执行如下操作：

code {
   font-family: "Times New Roman", Georgia, serif;
}

如果使用多个姓氏，浏览器将选择第一个找到的使用@font-face嵌入在页面上或安装在用户操作系统上的姓氏。

Answer 2

Safari 应该能够获取 TTF 文件，无论什么版本。

@font-face {
  font-family: 'MyFontFamily';
   src: url("fonts/Poppins-Regular.woff") format('woff'), 
   url("fonts/Poppins-Regular.ttf")  format('truetype');
}

Answer 3

不要使用特定的字体系列名称，请尝试：

font-family: inherit;