Edge 浏览器未加载字体?
Edge Browser not loading font-face?
使用正常的 CSS font-face
似乎无法在新的 Windows 10 Edge 浏览器上正常工作。在 IE11 和所有其他浏览器上工作正常。还有其他人看到这个吗?似乎是浏览器中的错误。
这是我们一直在使用的 CSS。
@font-face {
font-family: "Univers";
src: url("../fonts/univers-webfont.eot");
src: local(Univers), url("../fonts/univers-webfont.eot"), url("../fonts/univers-webfont.svg"), url("../fonts/univers-webfont.ttf"), url("../fonts/univers-webfont.woff");
font-weight: normal;
font-style: normal;
}
.button_black {
font-family: "Univers";
font-size: 18px;
color: @slb-off-black-1;
}
简答
使用 local("Font Name")
语法时,在字体名称两边加上引号。
说明
"Univers" 在 Edge 和 Firefox 中都可以正常显示。但是,您的 "Please log in..." 元素的目标是 "Univers Condensed",只有当您使用带引号的 local("Univers Condensed")
时,它才会在 Edge 中呈现。这可能是因为 Edge 比 Firefox 更严格。 MDN says...
src URL for the remote font file location, or the name of a font on the user's computer in the form local("Font Name")
. You can specify a font on the user's local computer by name using the local()
syntax. If that font isn't found, other sources will be tried until one is found.
一些片段
以下是显示您网站上存在问题的 CSS 和 HTML 的一些屏幕截图。
宇宙浓缩
local()
上没有报价
使用正常的 CSS font-face
似乎无法在新的 Windows 10 Edge 浏览器上正常工作。在 IE11 和所有其他浏览器上工作正常。还有其他人看到这个吗?似乎是浏览器中的错误。
这是我们一直在使用的 CSS。
@font-face {
font-family: "Univers";
src: url("../fonts/univers-webfont.eot");
src: local(Univers), url("../fonts/univers-webfont.eot"), url("../fonts/univers-webfont.svg"), url("../fonts/univers-webfont.ttf"), url("../fonts/univers-webfont.woff");
font-weight: normal;
font-style: normal;
}
.button_black {
font-family: "Univers";
font-size: 18px;
color: @slb-off-black-1;
}
简答
使用 local("Font Name")
语法时,在字体名称两边加上引号。
说明
"Univers" 在 Edge 和 Firefox 中都可以正常显示。但是,您的 "Please log in..." 元素的目标是 "Univers Condensed",只有当您使用带引号的 local("Univers Condensed")
时,它才会在 Edge 中呈现。这可能是因为 Edge 比 Firefox 更严格。 MDN says...
src URL for the remote font file location, or the name of a font on the user's computer in the form
local("Font Name")
. You can specify a font on the user's local computer by name using thelocal()
syntax. If that font isn't found, other sources will be tried until one is found.
一些片段
以下是显示您网站上存在问题的 CSS 和 HTML 的一些屏幕截图。