@ font-face在网站上显示不正确

我有一个myshopify网站，我试图使用@font-face显示字体..但由于某种原因，字体没有生效..这里是我的：@ font-face在网站上显示不正确

使用myshopify资源网址在CSS中的资源文件夹

字体文件：

@font-face { 
    font-family: 'LeagueGothicRegular'; 
    src: url('{{ 'League_Gothic-webfont.eot' | asset_url }}'); 
    src: url('{{ 'League_Gothic-webfont.eot?iefix' | asset_url }}') format('embedded-opentype'), 
    url({{ 'League_Gothic-webfont.woff' | asset_url }}) format('woff'), 
    url('{{ 'League_Gothic-webfont.ttf' | asset_url }}') format('truetype'), 
    url('{{ 'League_Gothic-webfont.svg#LeagueGothicRegular' | asset_url }}') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
} 


.. 

#top-menu a{ 
    font-family: 'LeagueGothicRegular', sans-serif; 
    background-color: #fff; 
    border-top-left-radius: 5px; 
    border-top-right-radius: 5px; 
    color: #000000; 
    display: inline-block; 
    font-size: 1.97em; 
    line-height: 1; 
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3); 
    padding: 6px 18px; 
    padding-top: 8px; 
    text-decoration: none 
}

什么蹦出来？ THANKYOU！

来源

2013-04-01 user1833002

我发现了一个similar SO question关于使用字体的面孔与Shopify这似乎表明，你需要删除随时随地可以使用CSS URL中的asset_url过滤器（这是我所建议的相反外报价在我原来的答复）：

@font-face { 
    font-family: 'LeagueGothicRegular'; 
    src: url({{ 'League_Gothic-webfont.eot' | asset_url }}); 
    src: url({{ 'League_Gothic-webfont.eot?iefix' | asset_url }}) format('embedded-opentype'), 
     url({{ 'League_Gothic-webfont.woff' | asset_url }}) format('woff'), 
     url({{ 'League_Gothic-webfont.ttf' | asset_url }}) format('truetype'), 
     url({{ 'League_Gothic-webfont.svg#LeagueGothicRegular' | asset_url }}) format('svg'); 
    font-weight: normal; 
    font-style: normal; 
}

这似乎是由asset_urldocumentation page（接近底部）确认。

根据其他question，您可能还需要修改包含字体的文件夹的htaccess。

来源

2013-04-01 21:58:09

谢谢..但唉，没有解决它.. grrr – user1833002

您的CSS文件保存为.liquid扩展名？根据[this]（http://ecommerce.shopify.com/c/ecommerce-design/t/css-disregards-liquid-tags-115513），Shipify可能需要知道解析文件。 –

是的，唉，这是.. – user1833002

我遇到了同样的问题。

经过进一步的检查，我的字体文件具有与其他主题文件不同的权限。我用chmod使它们像其他644一样，然后重新上传。像魅力一样工作。

chmod 644 LeagueGoth*

并重新上传。

来源

2014-04-26 19:57:03

@ font-face在网站上显示不正确

回答

相关问题