由于某些原因,我的字体面不显示在谷歌浏览器。它可以与其他浏览器兼容,甚至在android移动网络浏览器上。我读了很多关于为什么它可能(谷歌chrome更新等)的帖子,但我不确定是什么问题或如何解决它。我希望有人能看看我的代码,看看他们是否有什么错。
我的Font face CSS:
@font-face {
font-family: 'source_sans_proregular';
src: url('sourcesanspro-regular.eot');
src: url('sourcesanspro-regular.eot?#iefix') format('embedded-opentype'),
url('sourcesanspro-regular.woff') format('woff'),
url('sourcesanspro-regular.ttf') format('truetype'),
url('sourcesanspro-regular.svg#source_sans_proregular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'source_sans_problack';
src: url('sourcesanspro-black.eot');
src: url('sourcesanspro-black.eot?#iefix') format('embedded-opentype'),
url('sourcesanspro-black.woff') format('woff'),
url('sourcesanspro-black.ttf') format('truetype'),
url('sourcesanspro-black.svg#source_sans_problack') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'source_sans_probold';
src: url('sourcesanspro-bold.eot');
src: url('sourcesanspro-bold.eot?#iefix') format('embedded-opentype'),
url('sourcesanspro-bold.woff') format('woff'),
url('sourcesanspro-bold.ttf') format('truetype'),
url('sourcesanspro-bold.svg#source_sans_probold') format('svg');
font-weight: normal;
font-style: normal;
}
我的CSS实现位置:
.headerBarText {font-family:'source_sans_proregular';
font-size:37pt;
color:#FFF;
font-weight:bold;
padding-bottom:0px;
padding-top:7px;
padding-left:15px}
我回答了自己的问题。到CSS文件的链接需要一个大写字母,我发现的另一个问题是,我在"font-family"请求中调用的字体拼写错误。