如何添加自定义字体？

如何在html网站上安装自定义字体？如何添加自定义字体？

例如，我正在一个婚礼网站上工作，并且我正在为该主题找到许多不错的字体，但我找不到正确的方式将该字体添加到服务器，或者包含该字体与CSS？

2014-02-13 Val Do

http://stackoverflow.com/questions/107936/how-to-add-some-non-standard-font-to-a-website?rq= 1 –

潜入@ font-face http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp – timo

您是否失去了谷歌地址？ – Felix

下载你的字体并放在任何目录。在这里，我加入字体目录

<style> 
    @font-face { 
     font-family: 'maven_pro_light_300regular'; 
     src: url('fonts/mavenprolight-300-webfont.eot'); 
     src: url('fonts/mavenprolight-300-webfont.eot?#iefix') format('embedded-opentype'), 
      url('fonts/mavenprolight-300-webfont.ttf') format('truetype'), 
      url('fonts/mavenprolight-300-webfont.woff') format('woff'), 
      url('fonts/mavenprolight-300-webfont.svg#maven_pro_light_300regular') format('svg'); 
     font-weight: normal; 
     font-style: normal; 
    } 

    </style>

，你可以用它通过遵循例如：

<style> 
h2{ 
    font-family:maven_pro_light_300regular; 
} 
</style>

来源

2014-02-13 08:17:38

.my-font{ font-family: font name; }

这是CSS代码。

来源

2014-02-13 08:13:14

使用CSS3可以引用HTML页面上使用的字体文件。以下是一些代码：

<style> 
@font-face 
{ 
font-family: myFirstFont; 
src: url(fontFILE.woff); 
} 

div 
{ 
font-family:myFirstFont; 
} 
</style>

该文件的位置将被添加以代替“fontFILE”。您只需将字体文件和HTML页面一起上传。

这里是关于这个W3Schools的文章：here

来源

2014-02-13 08:13:23 SyntaxLAMP

如果你使用一个服务像Font Squirrel可以让你有使用权的任何字体的网页安全版本。它还会创建一个包含您需要的所有样式的样式表。剩下的就是在css中添加font-family，并在您的html页面中包含CSS样式表。

来源

2014-02-13 08:15:53

谷歌字体有一个非常容易安装和合法罚款，使用任何你喜欢的广泛的自定义字体：https://www.google.com/fonts。只需浏览并单击所需的字体，然后单击USE。它会为您提供所有必要的CSS，而且这些字体文件本身由Google托管。

如果要创建完全自定义的Web字体，可以使用FontSquirrel的Web字体生成器（http://www.fontsquirrel.com/tools/webfont-generator）。这使您可以上传您已经拥有的任何True Type字体文件，并将其转换为网络字体;它也会为您提供必要的CSS，但您需要自己托管字体文件。

对于后者的选择要小心合法;并非所有字体都被授权在网络上使用。

来源

2014-02-13 08:16:44 BFWebAdmin

如果你有一个真正的字体，那么你就必须使用这个

@font-face 
{ 
font-family: your_font_name; 
src: url(your_font_folder/font_name.ttf); 
}

并像这样使用它

h2.title{font-family:your_font_name}

或另一种方式来使用谷歌API的字体https://www.google.com/fonts

来源

2014-02-13 08:21:57 Aditya

如何添加自定义字体？

回答

相关问题