我已经设置了我在这个问题的答案中所述的字体:font-face not working on mobile
以下是我设置的方法:
@font-face {
font-family: 'SF Distant Galaxy';
src: url('./files/SFDistantGalaxy.eot');
src: url('./files/SFDistantGalaxy.eot?#iefix') format('embedded-opentype'),
url('./files/SFDistantGalaxy.woff2') format('woff2'),
url('./files/SFDistantGalaxy.woff') format('woff'),
url('./files/SFDistantGalaxy.ttf') format('truetype'),
url('./files/SFDistantGalaxy.svg#SFDistantGalaxy') format('svg');
font-weight: normal;
font-style: normal;
}
这里正在使用:
#title {
font-family: 'SFDistantGalaxy';
letter-spacing: 3.3px;
text-align: center;
color: #f8e71c;
font-size: 95px;
}
当我在浏览器上打开它时,它加载得很好。但是当我在手机上打开它时,它显示的是Times New Roman。
这是网站: http://starwarsplanets.com/
我很乐意为此提供任何反馈!谢谢!
答案 0 :(得分:1)
您需要更改css字体标题以匹配字体:
#title {
font-family: 'SF Distant Galaxy';
color: #f8e71c;
font-size: 95px;
margin: 10px 0 10px 0;
display: block;
position: fixed;
left: 0;
top: 0;
width: 100%;
}