Question

我尝试使用@ font-face规则向我的网页添加字体，但未显示

HTML

<!-- language: lang-html -->

    <ul>
    <li>GREAT</li>
    <li>BITE</li>
    </ul>

CSS

<!-- language: lang-css -->

body{
font-family:Armata;
font-size:16px;
    color:orange;
text-align: center;
background:white;
}

    @font-face {
    font-family: 'Armata';
    src: url(Armata-Regular.ttf),
    src: url(Armata-Regular.otf),
    src: url(Armata-Regular.eot);
    }

您可以从此处下载字体：http://www.moldire.com

Answer 1

您需要将font-face放在CSS的顶部。

   @font-face {
        font-family: 'Armata';
        src: url(Armata-Regular.ttf),
        src: url(Armata-Regular.otf),
        src: url(Armata-Regular.eot);
        }
    body{
    font-family:Armata;
    font-size:16px;
        color:orange;
    text-align: center;
    background:white;
    }

Answer 2

@font-face {
    font-family: 'Armata';
    src: url(Armata-Regular.ttf),
    src: url(Armata-Regular.otf),
    src: url(Armata-Regular.eot);
    }

li
{
font-family:Armata;
}

或者如果您想将其用于整页，请将其应用于正文标记

Answer 3

以下是让字体工作的步骤：

字体首先在css中（已经提到过）
拥有字体的类型/格式 - EX：src: url(Armata-Regular.ttf) format('truetype')
确保您的主机（本地或非本地）具有这些字体的MIME类型

最后，您会考虑使用网络字体路径吗？通过获取Web路径嵌入字体来节省您的时间：http://www.google.com/fonts/specimen/Armata

这样做可以节省你跳过最后一颗子弹的时间。

Answer 4

在您的网站上使用此功能

    <link href='http://fonts.googleapis.com/css?family=Armata' rel='stylesheet' type='text/css'>

在CSS中你需要这个：

    font-family: 'Armata', sans-serif;

我无法使用@ font-face规则在html页面中嵌入字体

4 个答案: