在网页上使用外部字体格式

最新推荐文章于 2024-11-07 21:55:04 发布

赏花赏景赏时光

最新推荐文章于 2024-11-07 21:55:04 发布

阅读量3k

点赞数

分类专栏： css 文章标签：在网页上使用外部字体格式

本文链接：https://blog.csdn.net/tangxiujiang/article/details/78952347

版权

css 专栏收录该内容

33 篇文章 1 订阅

订阅专栏

在网页上使用外部字体格式

1、首先下载web font的文件，其中格式有.ttf(TrueTypeFont)是由Apple公司和Microsoft公司共同推出的字体文件格式，.svg，.eot，.woff，如下所示为整个目录：

2、然后再文件里面引用1中下载的文件

 @font-face{
		font-family: HYShiGuangTiW;     /*自定义的字体名*/
		src:url('HYShiGuangTiW.ttf');   /*引入字体包*/
      }

3、使用引入的字体

p{
	font-family: HYShiGuangTiW;       /*使用引入的外部字体*/
	font-size: 30px;
    }

4、显示的效果

5、整个文件的内容：

<!DOCTYPE html>
    <html>
    <head>
	<title>test</title>
	<meta charset="utf-8" />
	<style>
		@font-face{
			font-family: HYShiGuangTiW;     /*自定义的字体名*/
			src:url('HYShiGuangTiW.ttf');   /*引入字体包*/
		}

		p{
			font-family: HYShiGuangTiW;       /*使用引入的外部字体*/
			font-size: 30px;
		}
	</style>
    </head>
    <body>
        <p>机四大行</p>
        <p>sjdjsdj</p>
    </body>
    </html>