CSS引入外部字体方法，附可用demo

mudiyouyou 发布于2019-08-30 14:00 / 2310人阅读

摘要：有时候我们做的页面需要用到一些更好看的字体又不想用图片代替，图片会影响加载速度则使用外部字体来显示但是直接通过又不一定全部都行这就需要我们在中进行定义并且引入字体文件路径然后再使用外部字体直接上代码引用外部字体里客云资源站其中替换为

有时候我们做的页面需要用到一些更好看的字体
又不想用图片代替，图片会影响加载速度
则使用外部字体来显示
但是直接通过font-family又不一定全部都行
这就需要我们在css中进行定义并且引入字体文件路径
然后再使用外部字体

直接上代码：
font.html




    
    CSS引用外部字体
    


里客云资源站
www.likeyunba.com

font.css

@font-face {
 font-family: "fontnameRegular";
 src: url("fontname.eot");
 src: local("fontname Regular"),
        local("fontname"),
        url("fontname.woff") format("woff"),
        url("fontname.ttf") format("truetype"),
        url("fontname.svg#fontname") format("svg");
}  
/*其中fontName替换为你的字体名称*/
h1{font-family: fontnameRegular}

字体文件下载：
https://pan.lanzou.com/i0jon3e

其中上面的font.css
fontname代表字体文件名的名称
例如你的字体文件是heiti.ttf
那么上面的
fontname全都要改为heiti

OK，引入之后的效果
看得出来是已经发生改变了！
里客云资源站
http://www.likeyunba.com
技术交流群请加微信：likeyunba520

云服务器专线服务引入外部css php引入外部文件. js中引入外部js css引入css

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/115693.html

CSS引入外部字体方法，附可用demo

...family又不一定全部都行这就需要我们在css中进行定义并且引入字体文件路径然后再使用外部字体直接上代码：font.html CSS引用外部字体里客云资源站 www.likeyunba.com font.css @font-face { font-family: "fontnameRegular"; src: url...

wangbinke 2019-08-01 18:36 评论0 收藏0
前端笔记之CSS（上）

...是记住，最终选择上的是最后的那个后代元素。 CSS引入方式内嵌式：内嵌式优点：加载速度快，因为不用再多一个HTTP请求，结构和样式半分离。将CSS嵌入到HTML页面head标签对中： ...

番茄西红柿 2019-04-23 11:45 评论0 收藏0
jQuery+PHP实现点击按钮加载更多，不刷新页面加载更多数据！附：可用源码+demo

...数据库并输出数据库的所有数据。注意，index.php里面需要引入jQuery库，jquery.min.js自己可以去网上下载这个压缩版的。我把php代码全部用一个独立文件connect_sql.php写，然后通过直接引入到index.php中新建connect_sql.php connect_sql.php就...

LeoHsiun 2019-08-26 11:48 评论0 收藏0
jQuery+PHP实现点击按钮加载更多，不刷新页面加载更多数据！附：可用源码+demo

...数据库并输出数据库的所有数据。注意，index.php里面需要引入jQuery库，jquery.min.js自己可以去网上下载这个压缩版的。我把php代码全部用一个独立文件connect_sql.php写，然后通过直接引入到index.php中新建connect_sql.php connect_sql.php就...

Ashin 2019-06-28 18:26 评论0 收藏0
PHP+AJAX实现账号注册和登陆，附可用demo

前言登陆和注册已经是网站的标配了，所以这是我们web开发学习过程中必学的了。其实很容易实现，只需要懂数据库的增删改查，还有if_else的条件语句即可做出来。目录 css --Login-Reg.css server --LoginUser.php --RegUser....

mrcode 2019-07-01 11:18 评论0 收藏0