正文 

当前位置： 首页 > 问答 >

如何添加自定义字体？ [复制]

     2023-03-15     299

关键词：

【中文标题】如何添加自定义字体？ [复制]【英文标题】：How do I add custom fonts? [duplicate] 【发布时间】：2014-03-11 23:48:32 【问题描述】：

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

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

【问题讨论】：

***.com/questions/107936/… 深入了解@font-face w3schools.com/cs-s-ref/css3_pr_font-face_rule.asp 你丢失了谷歌地址吗？ 查看 Paul Irishs Blogpost 的防弹字体。 paulirish.com/2009/bulletproof-font-face-implementation-syntax 【参考方案1】：

下载您的字体并放在任何目录中。这里我在fonts目录中添加了

   <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>

【讨论】：

【参考方案2】：

.my-font font-family: font name;

这是css代码。

【讨论】：

【参考方案3】：

使用 CSS3，您可以引用字体文件以在 HTML 页面上使用。这是一些代码：

<style> 
@font-face

font-family: myFirstFont;
src: url(fontFILE.woff);


div

font-family:myFirstFont;

</style>

将添加文件的位置来代替“fontFILE”。您只需将字体文件与 HTML 页面一起上传即可。

这是一篇关于此的 W3Schools 文章：here

【讨论】：

【参考方案4】：

如果您使用Font Squirrel 之类的服务，您可以制作您有权使用的任何字体的网络安全版本。它还创建了一个包含您需要的所有内容的样式表。剩下的就是在 css 中添加 font-family 并将 css 样式表包含在您的 html 页面中。

【讨论】：

【参考方案5】：

Google Fonts 拥有大量自定义字体，这些字体非常易于安装，并且可以合法地在您喜欢的任何地方使用：https://www.google.com/fonts。只需浏览并单击所需的字体，然后单击使用。它会为您提供所有必要的 CSS，并且字体文件本身由 Google 托管。

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

在法律上小心后一种选择；并非所有字体都被许可在网络上使用。

【讨论】：

【参考方案6】：

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

@font-face

 font-family: your_font_name;
 src: url(your_font_folder/font_name.ttf);

并像这样使用它

h2.titlefont-family:your_font_name

或其他方式使用 Google 字体 API https://www.google.com/fonts

【讨论】：

我们如何在 iOS 应用中使用自定义字体？ [复制]

】我们如何在iOS应用中使用自定义字体？[复制]【英文标题】：HowcanweusecustomfontinaniOSapp?[duplicate]【发布时间】：2012-10-1308:07:54【问题描述】：可能重复：CanIembedacustomfontinaniPhoneapplication?如何在我的iPhone应用程序中自定义字体？可... 查看详情

如何在 iPhone SDK 中使用自定义字体？ [复制]

】如何在iPhoneSDK中使用自定义字体？[复制]【英文标题】：HowtousecustomfontsiniPhoneSDK?[duplicate]【发布时间】：2012-12-3120:46:47【问题描述】：我想在我的应用中实现自定义字体。所以我在我的项目源代码中添加了它。我不想以编程方... 查看详情

如何在 SwiftUI 中使用 Font Awesome 作为自定义字体？

】如何在SwiftUI中使用FontAwesome作为自定义字体？【英文标题】：HowdoIuseFontAwesomeasacustomfontinSwiftUI?【发布时间】：2020-09-2806:47:21【问题描述】：我已经按照许多教程向我的SwiftUI包添加自定义字体。我已采取以下步骤：将FontAwesome5F... 查看详情

如何在网站上使用自定义字体？ [复制]

】如何在网站上使用自定义字体？[复制]【英文标题】：HowcanIusecustomfontsonawebsite?[duplicate]【发布时间】：2012-11-1503:07:36【问题描述】：为了让我的网站看起来不错，我需要使用自定义字体，特别是Thonburi-Bold。问题是-除非用户安... 查看详情

如何在 CSS 中使用自定义字体？ [复制]

】如何在CSS中使用自定义字体？[复制]【英文标题】：HowtouseacustomfontinCSS?[duplicate]【发布时间】：2018-05-1206:39:33【问题描述】：我找到了最漂亮的字体here。我想用它。我尝试了以下操作：@font-facefont-family:myFirstFont;src:url(http://fonts... 查看详情

如何在 iOS 应用程序中使用自定义字体？ [复制]

】如何在iOS应用程序中使用自定义字体？[复制]【英文标题】：HowtousecustomfontiniOSApps?[duplicate]【发布时间】：2012-03-1005:04:14【问题描述】：可能重复：CanIembedacustomfontinaniPhoneapplication?您好，我想在我的原生iOS应用中使用缅甸字体... 查看详情

如何在 swiftui 中添加自定义字体？

】如何在swiftui中添加自定义字体？【英文标题】：HowdoIaddcustomfontsinswiftui?【发布时间】：2020-11-2003:14:53【问题描述】：我想在我的swiftui游戏中添加自定义字体。有谁知道这是怎么做到的吗？我尝试观看youtube视频，但找不到任何... 查看详情

如何在 Flutter Web 中添加自定义字体？

】如何在FlutterWeb中添加自定义字体？【英文标题】：Howtoaddcustomfontinflutterweb?【发布时间】：2019-12-1203:30:14【问题描述】：所以我正在开发flutter移动应用有一段时间了，我想探索flutterweb，现在我尝试添加自定义字体但它没有显... 查看详情

如何在 Java 中使用自定义字体？

】如何在Java中使用自定义字体？【英文标题】：HowcanIuseacustomfontinJava?【发布时间】：2011-08-0420:56:02【问题描述】：我用Java编写了一个程序，它使用一种特殊字体，默认情况下在任何操作系统上都不存在该字体。在Java中是否可... 查看详情

如何在 TCPDF 中添加自定义字体？

】如何在TCPDF中添加自定义字体？【英文标题】：HowdoyouaddcustomfontsinTCPDF?【发布时间】：2015-07-0522:15:28【问题描述】：我想在使用TCPDF生成的pdf中添加自定义字体。我可能遗漏了一些东西，但thedocs似乎已经过时了。他们引用了addT... 查看详情

如何将自定义按钮添加到 UINavigationBar？ [复制]

】如何将自定义按钮添加到UINavigationBar？[复制]【英文标题】：HowtoaddcustombuttonstoaUINavigationBar?[duplicate]【发布时间】：2015-01-2807:12:14【问题描述】：正如我的问题所述，我正在尝试将自定义按钮添加到UINavigationBar。AFAIK，您只能... 查看详情

wpf添加自定义字体(代码片段)

原文:【WPF】添加自定义字体需求：在WPF项目中使用幼圆字体。步骤：1、首先要有幼圆TTF字体文件。在C:WindowsFonts目录下找，如果系统字体库中没有，就上网下一份，如这里或这里。2、将字体文件复制到WPF项目中（改文件名去掉... 查看详情

wpf添加自定义字体

需求：在WPF项目中使用幼圆字体。步骤：1、首先要有幼圆TTF字体文件。在C:WindowsFonts目录下找，如果系统字体库中没有，就上网下一份，如这里或这里。2、将字体文件复制到WPF项目中（改文件名去掉中文）。例如：项目根目录/P... 查看详情

如何将自定义标签添加到 ggplot？ [复制]

】如何将自定义标签添加到ggplot？[复制]【英文标题】：Howtoaddcustomizedlabelstoggplot?[duplicate]【发布时间】：2021-09-1900:45:50【问题描述】：我正在尝试将另一列（年份）的标签添加到我的ggplot图中，但它给了我以下错误：Error:geom_tex... 查看详情

ionic2添加自定义文字

上次更新到如何添加自定义图标，紧接着这次更新ionic2如何添加自定义字体首先你要有自己的字体文件以.ttf结尾的文件字体:推荐个字体文件网站（相对来说流氓软件比较少的）http://www.ps123.net/photoshop然后：比如我下载的字体是M... 查看详情

如何将自定义 jar 文件添加/复制到 Kafka MirrorMaker 中？

】如何将自定义jar文件添加/复制到KafkaMirrorMaker中？【英文标题】：Howtoadd/copyacustomjarfileintoKafkaMirrorMaker?【发布时间】：2022-01-0310:03:12【问题描述】：我正在开发一些自定义主题名称映射，并从中生成了一个jar文件。由于我使用... 查看详情

如何为没有自定义字体的用户下载自定义字体？ [复制]

】如何为没有自定义字体的用户下载自定义字体？[复制]【英文标题】：Howtodownloadcustomfontforuserswhodon\'thaveit?[duplicate]【发布时间】：2012-12-2917:23:09【问题描述】：可能重复：Howtoaddsomenon-standardfonttoawebsite?一位客户向我发送了一个... 查看详情

如何在 Laravel TailwindCss Vue Js 项目中添加和使用本地自定义字体？

】如何在LaravelTailwindCssVueJs项目中添加和使用本地自定义字体？【英文标题】：HowtoaddanduseLocalcustomfontinaLaravel+TailwindCss+Vuejsproject?【发布时间】：2021-06-0905:49:01【问题描述】：正如标题所示，我正在尝试在我的项目中添加和使用... 查看详情