字体系列输出不变 [英] Font family does not change in the output

问题描述

在< h1>标记，当我为任何文本块(或分区)更改任何字体系列，并在浏览器中将其打开时，字体系列不会更改.我已经将其应用于h1，根本没有任何变化.

In the < h1 > tag, when I change any font family for any block of text (or a division), and open it in the browser, the font-family does not change. There is no change at all in h1, that I had applied it to.

以下是我的HTML代码:

Following is my HTML code:

<h1 align="center" class="login">      
           LOG IN</h1><hr /><br />

这是我的CSS代码:

.login
{
    color:Black;
    font-family:Calibri;
    font-size:xx-large;
    font-weight: bold;

}

我得到的输出如下:

我也将字体更改为Calibri.但是，没有任何变化被反映出来.输出始终显示相同的字体系列.我不明白，问题可能出在哪里?

I changed the font to Calibri also. But, no change was reflected. The output always shows the same font family. I do not understand, where the problem could be?

推荐答案

检查您的个人样式css文件中的@ font-face规则. 您应该这样添加字体:

check your @font-face rule in your personal style css file. you should add your fonts like this:

@font-face {
  font-family: "font name";
  src: url(font path/font name.eot);
  src: url(font path/font name.eot?#iefix) format('embedded- 
  opentype'),
   url(font path/font name.woff) format('woff'),
   url(font path/font name.ttf) format('truetype'),
   url(font path/font name.svg#font name) format('svg');
   font-weight: normal;
   font-style: normal
 }

，然后在字体系列前面写上字体名称，并在格式中使用双引号或单引号，例如"Calibri".或"Calibri"，"svg"或"svg"，另一种引号也会导致字体也无法正确更改(当您将@ font-face规则的代码从某些网站复制并粘贴到编辑器中时，您会看到报价的形状不同).

and write your font name in front of font-family and the formats in the double quotation or single quotation like "Calibri" or 'Calibri' and 'svg' or "svg", the other type of quotation causes the font to not change correctly too(when you copy and paste your @font-face rule's code from some websites to your editor you can see that the shape of quotation differs).

并检查您的路径，您应使用正斜杠(/)将其分开，例如"my project/fonts/Calibri.woff2".

and check your path you should separate it with forward-slash(/) e.g "my project/fonts/Calibri.woff2".

使用不同的格式在不同的浏览器中正确显示字体. IE8及更低版本的格式，"ttf"对于旧的浏览器，尤其是对于移动设备，"SVG"表示对于旧的浏览器，"woff"表示和"woff2"对于所有现代浏览器，如果没有这些浏览器，则可以在"transfonter.com"中转换字体.

Use different formats to display your font correctly in different browsers."eot" format for IE8 and below, "ttf" for old browsers especially for mobiles, "SVG" for old browsers, "woff" and "woff2" for all modern browsers, if you don't have them you can transform your font in "transfonter.com".

这篇关于字体系列输出不变的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！