html页面怎么引用ttf,CSS怎么引用外部ttf字体？

CSS如何引用外部字体？

在CSS中可以使用font-face属性来引用外部字体，font-face属性可实现任何外部特殊字体的调用，例如：.ttf字体。

在新的 font-face 规则中，必须首先定义字体的名称(比如 myFirstFont)，然后指向该字体文件。

如需为 HTML 元素使用字体，请通过 font-family 属性来引用字体的名称 (myFirstFont).

font-face属性引用ttf字体示例：

示例1：

@font-face

{

font-family: myFirstFont;

src: url('aa.ttf'),

url('aa.eot'); /* IE9+,可以是具体的实际链接 */

}

div

{

font-family:myFirstFont;

}

示例1：@font-face

{

font-family: myFirstFont;

src: url('aa.ttf'),

url('aa.eot'); /* IE9+ */

font-weight:bold;

}

font-face属性对浏览器的支持：

Firefox、Chrome、Safari 以及 Opera 支持 .ttf (True Type Fonts) 和 .otf (OpenType Fonts) 类型的字体。

Internet Explorer 9+ 支持新的 font-face 规则，但是仅支持 .eot 类型的字体 (Embedded OpenType)。

html页面怎么引用ttf,CSS怎么引用外部ttf字体？相关推荐

页面HTML标签与css样式
1.HTML基本结构 <html> <head>...</head> <body>...</body> </html> 1.首 ...
SpringBoot页面跳转访问css、js等静态资源引用无效解决
SpringBoot页面跳转访问css.js等静态资源引用无效解决原文链接:https://blog.csdn.net/qq_41647999/article/details/83788265 目录 ...
html中css如何引用自定义字体 - 案例篇
html中css引用自定义字体,实现自定义字体样式效果(含案例) 网页中不同的字体,代码是怎么定义的?怎么引用外来字体文件? html 案例 · 代码如下: <!DOCTYPE html> ...
在css中引用特殊字体
在浏览器中引用特殊字体时, 要将字体先下载到我们的电脑上,然后将字体文件放置至项目中. 接下来在css中引用字体时, 1..EOT,适用于Internet Explorer 4.0+ 2..TTF或. ...
html图片分开,webpack单独分离打包css，css里引用的图片路径错误，怎么解决？
现在我的这个项目是将css和js单独打包出来,打包后的目录结构和打包前一致. 打包前: 从这张图可以看到,如果是css文件夹根目录下的css文件引用images文件夹下的图片应该使用../就可以了,如 ...
vue 引用网络css_vue如何引用其他组件（css和js）
1.vuejs组件之间的调用components 注意:报错Do not use built-in or reserved HTML elements as component id: 修改组件的名字 ...
vue引用自定义.css文件 - 语法篇
vue如何引用外部自定义的.css文件 ? 一般都会因为存在权重或优先级设置的问题才会侧意引用: [详情进入查看:如何在scoped不污染组件样式的前提下,实现el-input组件样式覆盖?] 再者, ...
直接在 CSS 中引用 FONTAWESOME 图标（附码表）
直接在 CSS 中引用 FONTAWESOME 图标(附码表) 因此我们如果不想用 Fontawesome 提供的类,只想在 css 里面引用图标的话,可以这样子,请自行脑补: .icon:befor ...
解决SSM项目下静态资源(img、js、css)无法引用的问题
解决SSM项目下静态资源(img.js.css)无法引用的问题参考文章: (1)解决SSM项目下静态资源(img.js.css)无法引用的问题 (2)https://www.cnblogs.com/ ...

html页面怎么引用ttf,CSS怎么引用外部ttf字体？

html页面怎么引用ttf,CSS怎么引用外部ttf字体？相关推荐

最新文章

热门文章