可以在手机网页中加载字体吗?(Arial Black for iOS)



字体Arial Black一般在Mac和PC上可用,但不支持iOS。

网页是否可以使用CSS或一些技巧(例如在<body>元素中添加"mobile""ios"类),使"Arial Black",以便Mac和PC不需要加载它,而是使用本机Arial Black字体。

假设某些系统有或没有在本地加载特定字体可能是不安全的。而且浏览器/系统嗅探是非常不可靠的。

CSS font-face规则允许您给出一个字体可能出现的位置列表,浏览器将沿着列表向下查找,直到找到一个可以使用的字体。所以你可以从本地开始查找如果它不在那里就加载它。

见https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face

如果提供了local()函数,指定要查找的字体名称对于用户计算机上的,并且用户代理找到匹配的,即使用本地字体。属性指定的字体资源Url()函数被下载并使用。

它给出了这个例子:

@font-face {
font-family: MyHelvetica;
src: local("Helvetica Neue Bold"),
local("HelveticaNeue-Bold"),
url(MgOpenModernaBold.ttf);
font-weight: bold;
}

显然你需要替换你的特定字体在不同系统中的名称和url。