Question

我想在我的网站上添加字体，但代码中有问题，我不知道是什么

@font-face {
  font-family: 'ostrich-regular-webfont';
  src: url('https://ostrichsans.googlecode.com/svn/ostrich-regular-webfont.eot');
  src: url('https://ostrichsans.googlecode.com/svn/ostrich-regular-webfont.eot?#iefix') format('embedded-opentype'),
       url('https://ostrichsans.googlecode.com/svn/ostrich-regular-webfont.woff2') format('woff2'),
       url('https://ostrichsans.googlecode.com/svn/ostrich-regular-webfont.woff') format('woff'),
       url('https://ostrichsans.googlecode.com/svn/ostrich-regular-webfont.ttf')  format('truetype'),
       url('https://ostrichsans.googlecode.com/svn/ostrich-regular-webfont.svg#ostrich-regular-webfont') format('svg');
}

    #contentmiddle h1 {
        font-family: 'ostrich-regular-webfont';
    }

Answer 1

Ostrich Sans是一种可以在Font Squirrel免费获得的字体。下载它，然后选择你想要使用的那个（我想你想要常规）。它们还有Webfont Generator，您可以在其中上传所选字体，它会自动生成您在网站中使用此字体所需的代码，并在您自己的服务器中托管字体。

会是这样的：

@font-face {
    font-family: 'ostrich_sansmedium';
    src: url('ostrich-regular-webfont.eot');
    src: url('ostrich-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('ostrich-regular-webfont.woff2') format('woff2'),
         url('ostrich-regular-webfont.woff') format('woff'),
         url('ostrich-regular-webfont.ttf') format('truetype'),
         url('ostrich-regular-webfont.svg#ostrich_sansmedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: 'ostrich_sansmedium';
}

您可以在CSS Tricks

中获取有关如何使用自定义字体的详细信息

Answer 2

试试这个：

#contentmiddle h1{
    font: 'ostrich-regular-webfont';
}

如果您希望将字体作为整个网站的默认字体，请使用正文标记。

body{
    font: 'ostrich-regular-webfont';
}

字体无法正常工作

2 个答案: