专栏首页黑马【Vue_09】Vue 使用特殊字体

【Vue_09】Vue 使用特殊字体

一、引入字体到 Vue 项目

1. 创建字体文件夹

在 static 文件夹下创建 font 文件夹。并将下载好的字体拷贝到文件夹下。

2. 创建字体样式文件(CSS)

@font-face {
  font-family: 'numberFont';    // 自定义字体名称
  src: url("./number.ttf");    // 字体的路径,后缀 ttf 一定能要小写,否则可能找不到字体文件
}

二、使用字体样式

1. 在所需页面应用相应字体样式

<style>
    @import "../../static/font/font.css";
</style>

2. 使用字体

<span style="font-family: numberFont">6690802</span>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • html常用实体字符,转义字符,特殊符号

    HTML 原代码显示结果描述&lt;<小于号或显示标记&gt;>大于号或显示标记&amp;&可用于显示其它特殊字符&quot;“引号&reg;®已注册&copy...

    Sindsun
  • vue 使用自定义字体

    在 static 文件夹下创建 font 文件夹。并将下载好的字体拷贝到文件夹下。

    Demo_Null
  • 网页特殊字体过大的优化

    ==font-spider 仅适用于固定文本,如果文字内容为动态可变的,新增的文字将无法显示为特殊字体。==

    天天_哥
  • 符号图表——特殊字体柱形图

    今天跟大家分享的是升级版的符号图表——特殊字体柱形图! ▽▼▽ 忘了是那一期,跟大家分享过如何用特殊字体+rept函数做条形图,今天要跟大家分享的符号图表同样是...

    数据小磨坊
  • Shell常用的特殊字符

    点号在不同场景有着不同的含义,在目录路径中,一个点代表当前工作目录,两个点代表父目录;当一个文件以点号开头,表示一个隐藏文件;在正则表达式,点号代表匹配单个字符...

    用户1679793
  • 常用特殊符号的HTML代码(HTML字符实体)

    ISO-8859-1 的较低部分(从 1 到 127 之间的代码)是最初的 7 比特 ASCII。

    用户5640963
  • 网络字体@font-face 如何处理网页中的特殊字体

    HTML5学堂:随着网页的发展,网页中出现了越来越多的字体种类,网页自带的微软雅黑、宋体、黑体已经越来越难以满足设计的需要,那么,如何在网站中使用比较特殊的字体...

    HTML5学堂
  • 特殊字体神器-fontmin,秒杀一切工具

    HTML5学堂:此前,我们介绍过font-spider这款软件,也讲解过处理网络字体的方法。而今我们为大家介绍一款能够秒杀之前所有工具的“特殊字体”制作工具。 ...

    HTML5学堂
  • linux特殊字符及其作用大全

    以上所述是小编给大家介绍的linux特殊字符及其作用大全,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对ZaLou...

    砸漏
  • 如何使用Sentry为包含特殊字符的用户组授权

    Apache Sentry是由Cloudera贡献给Hadoop开源社区的组件,它提供了细粒度级、基于角色的授权以及多租户的管理模式。Sentry当前可以和Hi...

    Fayson
  • iPhone开发中使用的特殊URL

    与此同时,iPhone还包含一些其他除了http://或者mailto:之外的URL: sms:// 可以调用短信程序 tel:// 可以拨打电话 itms:/...

    EltonZheng
  • 特殊需求下的DevTools使用心得

    ③ 确定SogouLoginUtils集成器存在的情况下,点击enter键,便会展现出集成器中所涵盖的所有js方法,通过检索,便可验证“特定域名网页注入js”...

    用户5521279
  • LeetCode 1974. 使用特殊打字机键入单词的最少时间

    https://leetcode-cn.com/problems/minimum-time-to-type-word-using-special-typewri...

    freesan44
  • LeetCode 1974. 使用特殊打字机键入单词的最少时间

    有一个特殊打字机,它由一个 圆盘 和一个 指针 组成, 圆盘上标有小写英文字母 ‘a’ 到 ‘z’。 只有 当指针指向某个字母时,它才能被键入。指针 初始时 ...

    Michael阿明
  • VUE 过滤输入框中的特殊字符 只保存中文、英文及数字

    heasy3
  • 特殊地区无法使用 git 的问题

    国内大部分地方 github 都可以直接上,但有些地区是无法直接访问的,需要使用梯子。成功访问 github 仅仅只是第一步,如果要使用 git clone、g...

    mathor
  • hive中 regexp_replace的用法,替换特殊字符问题

    https://cwiki.apache.org/confluence/display/Hive/LanguageManual+UDF#LanguageManu...

    Ryan-Miao
  • 十五、Vue表单输入绑定

    十五、Vue表单输入绑定

    Java架构师必看
  • SwiftUI 布局: ScrollView 使用 GeometryReader 创建特殊效果

    当我们使用GeometryReader的frame(in:)方法时,SwiftUI将计算视图在所需坐标空间中的当前位置。但是,随着视图移动,这些值将更改,Swi...

    韦弦zhy

扫码关注云+社区

领取腾讯云代金券