<p style=" font-family: 'Grinched 2.0';
font-size:50px;
margin-left:150px;
top:1500px;
position: absolute;">Apply now for a position in our team, send us</p>
这是一个非常愚蠢的问题,但严重的是现在已经 3 小时了,我无法解决它!
这是我设置字体的简单 html 代码!当我从计算机访问它时,它运行良好!但是当我通过手机访问网站时,没有应用字体系列属性!其他所有的东西,比如职位,工作正常!错在哪里?
最佳答案
正如@Marc B 所建议的,如果您的手机上没有安装该字体,那么它就不会显示。
要在网络上集成非默认字体,您需要使用@font-face
规则。一旦你用@font-face注册了你的字体,你就可以在你的css中使用它。但是,建议始终保留一些默认字体作为不支持 @font-face
的浏览器的后备,或者如果您的字体出现任何问题。
这是来自 Mozilla Developper Network 的示例
@font-face { // This will register your font
font-family: "Bitstream Vera Serif Bold";
src: url("http://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf");
}
p { //Then you can use it like so
font-family: "Bitstream Vera Serif Bold", serif;
}
更新
现在我们可以看到您的网站,我确信问题出在您没有注册 Grinched 2.0
字体这一事实。这解释了为什么当从您的桌面(安装了字体)查看时,任一站点都会显示该字体,但在移动设备上不显示。
如果您按照我上面的示例进行操作,它将起作用。这个小工具可以帮助您准备好字体,并为您提供所需的代码:http://www.fontsquirrel.com/tools/webfont-generator
关于html - 简单字体不变,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31834887/