2022年-新春倒计时-看心理

157 天 9 时 7 分 42 秒


远程设置字体

释放双眼,带上耳机,听听看~!

引用外部字体代码:

在css样式中插入下列代码

  1. @font-face{
  2. font-family: 'xxx';
  3. font-style: normal;
  4. font-display: swap;
  5. src: url('../font/aaa.woff') format('woff'),
  6. }

注释:  其中font-family: ‘xxx’; 中的 xxx  字体名称(可随意命名,需要与使用时的名字保持一直)

src: url(‘../font/aaa.woff’) format(‘woff’), 其中aaa为字体文件名,woff为文件格式,有的可能是woff2,也可能是ttf.之类.  url指的是调用的外部文件链接,可以是本地,可以是远程,如果是远程需要设置跨域,下面会给出方法.

 

使用字体代码:

  1. body{
  2. font-family: "xxx";
  3. }

这里xxx需要与 font-family: ‘xxx’; 中一致.

body是全局设置,也可以单独某个标签使用.

  1. @font-face {
  2. font-family: 'ziti';font-style: normal;font-display: swap;src: url('../fonts/two.ttf');
  3. }
  4. body {
  5. font-family: 'ziti';
  6. }

下面是跨域使用方法:

如使用的是nginx:

在网址配置文件中添加

  1. location ~* \.(eot|otf|ttf|woff|woff2)$ {
  2. add_header Access-Control-Allow-Origin *;
  3. }

如使用的是Apache:

根目录 .htaccess 中添加

  1. <FilesMatch "\.(ttf|otf|eot|woff|woff2)$">
  2. <IfModule mod_headers.c>
  3. Header set Access-Control-Allow-Origin "*"
  4. </IfModule>
  5. </FilesMatch>

 

@font-face {
font-family: ‘xxx’;
font-style: normal;
font-display: swap;
src: url(‘../fonts/aaa.ttf’);
}
body {
font-family: ‘xxx’;
}

给TA打赏
共{{data.count}}人
人已打赏
网站修改记录

为网站添加下雪效果

2021-12-28 0:38:43

网站修改记录

跑马灯欢迎模式

2021-12-28 1:40:25

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索