iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > VUE >css中使用font-face改变字体即加载外部字体的方法
  • 456
分享到

css中使用font-face改变字体即加载外部字体的方法

2024-04-02 19:04:59 456人浏览 独家记忆
摘要

这篇文章主要介绍“CSS中使用font-face改变字体即加载外部字体的方法”,在日常操作中,相信很多人在css中使用font-face改变字体即加载外部字体的方法问题上存在疑惑,小编查阅了各式资料,整理出

这篇文章主要介绍“CSS中使用font-face改变字体即加载外部字体的方法”,在日常操作中,相信很多人在css中使用font-face改变字体即加载外部字体的方法问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”css中使用font-face改变字体即加载外部字体的方法”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!


代码如下:


<!DOCTYPE html>
<meta charset="UTF-8">
<head>
<script src="Jquery-1.8.2.min.js"></script>
<style>
#gmap,#controls {
width:300px;
height:300px;
}
@font-face {
font-family: Lovelo-Black;/&times;定义font的名字&times;/
src: url('font/Lovelo Black.otf');/*把下载的字体文件引入进来&times;/
}
@font-face {
font-family: Lovelo;
src: url('font/Lovelo Line Bold.otf');
}
@font-face {
font-family: HYPED;
src: url('font/HYPED_Font.otf');
}
div.a {
font-family: Lovelo-Black, sans-serif;
font-size:24px;
}
div.b {
font-family: Lovelo, sans-serif;
font-size:24px;
}
div.c {
font-family: HYPED, sans-serif;
font-size:24px;
color:yellow;
}
body {
background-color:rgb(216, 216, 216);
}
</style>
<script>
</script>
</head>
<body class="sapUiBody">
<div class="a">Hello World 123456</div>
<div class="b">Hello World 123456</div>
<div class="c">Hello World 123456</div>
</body>

到此,关于“css中使用font-face改变字体即加载外部字体的方法”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注编程网网站,小编会继续努力为大家带来更多实用的文章!

--结束END--

本文标题: css中使用font-face改变字体即加载外部字体的方法

本文链接: https://www.lsjlt.com/news/75482.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • css中使用font-face改变字体即加载外部字体的方法
    这篇文章主要介绍“css中使用font-face改变字体即加载外部字体的方法”,在日常操作中,相信很多人在css中使用font-face改变字体即加载外部字体的方法问题上存在疑惑,小编查阅了各式资料,整理出...
    99+
    2024-04-02
  • css中改变字体大小的方法
    本文将为大家详细介绍“css中改变字体大小的方法”,内容步骤清晰详细,细节处理妥当,而小编每天都会更新不同的知识点,希望这篇“css中改变字体大小的方法”能够给你意想不到的收获,请大家跟着小编的思路慢慢深入,具体内容如下,一起去收获新知识吧...
    99+
    2023-06-06
  • css中font字体颜色的设置方法
    这篇文章给大家分享的是有关css中font字体颜色的设置方法的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。css是什么意思css是一种用来表现HTML或XML等文件样式的计算机语言,主要是用来设计网页的样式,使网...
    99+
    2023-06-08
  • 在Vue.js中加载字体的正确方法
    目录正确声明 font-face 的字体预加载字体使用 link = preconnect 托管字体使用 service workers 缓存字体结论添加字体不应该对性能产生负面影响...
    99+
    2024-04-02
  • CSS中的字体属性的使用方法
    这篇文章主要讲解了“CSS中的字体属性的使用方法”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS中的字体属性的使用方法”吧! 字体族 font...
    99+
    2024-04-02
  • ubuntu加载中文字体的方法是什么
    这篇“ubuntu加载中文字体的方法是什么”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“ubuntu加载中文字体的方法是什么...
    99+
    2023-07-04
  • CSS中使用font-family属性常用中文字体的英文别名有哪些
    这篇文章将为大家详细讲解有关CSS中使用font-family属性常用中文字体的英文别名有哪些,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。CSS中使用font-family属性引用中文字体时,经常采用三...
    99+
    2023-06-08
  • css如何使用span标签设置div内放一段文字中的部分文字字体颜色
    小编给大家分享一下css如何使用span标签设置div内放一段文字中的部分文字字体颜色,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!   用span标签设置div内放一段文字中的部分文字...
    99+
    2024-04-02
  • shell中使用echo打印彩色字体和彩色背景的方法教程
    这篇文章主要介绍“shell中使用echo打印彩色字体和彩色背景的方法教程”,在日常操作中,相信很多人在shell中使用echo打印彩色字体和彩色背景的方法教程问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”s...
    99+
    2023-06-09
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作