Question

好吧，我是CSS新手，所以我们走了。在模板中，我使用的是样式表

head {font-family：Verdana;字体大小：16px的;颜色：＃000000;}
  身体   {字体家庭：宋体;字体大小：12像素;颜色：#FFFFFF}
  一个   {颜色：＃FF0000; FONT-FAMILY：宋体;字体大小：30像素;}
  bluetext   {颜色：＃0000FF;}
  工具提示{字体家庭：宋体;字体大小：11像素;   颜色：#FFFFFF;}

所以我认为它决定了这些部分的字体应该是什么。如果我想在所有这些部分使用自定义字体而不是Verdana，我该怎么办？我有.ttf文件，但我不知道还能做什么。

提前致谢！

Answer 1

首先为所有浏览器生成字体，例如Mozilla为woff，IE等为eot。因此，您可以从http://www.fontsquirrel.com/fontface/generator＆amp; http://www.font2web.com/。然后在CSS中写下@font-face。

@font-face {
  font-family: 'font';
  src: url('font.eot?') format('eot'), url('font.woff') format('woff'), url('font.ttf') format('truetype');
}
body{
  font-family: 'font';
  color:#fff;
font-size:12px;
}
.head {font-size:16px; color:#000000;}
a {color:#ff0000; font-size:30px;}
.bluetext {color:#0000ff;}
.tooltip{font-size:11px;}

Answer 2

你需要使用font-face。基本实现是：

@font-face {
    font-family: CustomFontName;
    src: url(http://path-to/customfont.ttf);
    font-weight:400;
}

然后就像任何其他样式规则中的任何其他字体一样使用它。

p {
    font-family: CustomFontName, Helvetica, Arial, sans-serif;
}

Answer 3

您必须将此用于您的css文件：

@font-face {
    font-family: your_font;
    src: url('your_font.ttf');
}

为了使用IE，您应该使用.eot扩展名导出另一个版本的字体，并添加另一个src属性。

编辑：以下是有关使用@ font-face：http://www.webistrate.com/css3-custom-fonts-using-font-face/

的有用链接

Answer 4

首先在服务器/ system / root上安装此字体。

＆安培;然后在你的css中应用这样的

@font-face {
        font-family: 'myriadproregular'(i.e.custom font name);
        src: local('myriadproregular'), url('myriadproregular.ttf') format("truetype");
    }
    and  if you want more than one font you can do the same
    @font-face {
        font-family: 'myriadprocond';
        src: local('myriadprocond'), url('myriadprocond.ttf') format("truetype");
    }
    @font-face {
        font-family: 'myriadprosemibold';
        src: local('myriadprosemibold'), url('myriadprosemibold.ttf') format("truetype");
    }

只需使用您想要使用的字体名称即可比如

p
{
font-family:"custom font name"

}

CSS样式表和自定义字体

4 个答案: