Chrome和Firefox中的字体完全不同

Question

您好我使用的是字体而且我已经生成了一个webfont工具包。但是在firefox和Chrome上，字体的出现完全不同它们甚至根本不会消失。我还附上了一些关于字体外观的图像。有关如何做的任何建议？任何解决方案都将非常感谢提前感谢。我正在使用＆＃34; petescriptregular＆＃34;字体。

这就是我在CSS文件中使用字体的方式：

@font-face {
  font-family: 'MyriadPro-Regular';
  src: url('/www/magenta/wp-content/themes/ecorecycle/fonts/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),  url('/www/magenta/wp-content/themes/ecorecycle/fonts/MyriadPro-Regular.woff') format('woff'), url('/www/magenta/wp-content/themes/ecorecycle/fonts/MyriadPro-Regular.ttf')  format('truetype'), url('/www/magenta/wp-content/themes/ecorecycle/fonts/MyriadPro-Regular.svg#MyriadPro-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
    font-family: 'petescriptregular';
   src: url('/www/magenta/wp-content/themes/ecorecycle/fonts/petescript-webfont.eot');
    src: url('/www/magenta/wp-content/themes/ecorecycle/fonts/petescript-webfont.eot?#iefix') format('embedded-opentype'),
         url('/www/magenta/wp-content/themes/ecorecycle/fonts/petescript-webfont.woff2') format('woff2'),
         url('/www/magenta/wp-content/themes/ecorecycle/fonts/petescript-webfont.woff') format('woff'),
         url('/www/magenta/wp-content/themes/ecorecycle/fonts/petescript-webfont.ttf') format('truetype'),
         url('/www/magenta/wp-content/themes/ecorecycle/fonts/petescript-webfont.svg#petescriptregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

Firefox图片：

Chrome图片：

Answer 1

你应该使用firefox的.otf格式和IE的.otf格式 你可以转换像这个网站的字体格式 https://everythingfonts.com