将单个字体与CSS整个网站(Applying a single font to an entire

2019-06-23 10:32发布

我想用在我的整个网站名为“阿尔及利亚”单个字体。 所以,我需要改变所有的HTML标签,我不想写像不同的标签不同的代码:

button{font-family:Algerian;}
div{font-family:Algerian;}

下面所写的方法也非常气馁:

div,button,span,strong{font-family:Algerian;}

Answer 1:

font-family声明成body选择:

body {
  font-family: Algerian;
}

所有网页上的元素将继承这个FONT-FAMILY然后(当然,除非你以后覆盖它)。



Answer 2:

*{font-family:Algerian;}

DO这样



Answer 3:

通用选择*是指所有元素,这将CSS为你做它:

*{
  font-family:Algerian;
}

但不幸的是,如果你使用的是FontAwesome图标,或者需要自己的字体家族的任何图标,这只会破坏图标,他们将不会显示所需的视图。

为了避免这种情况可以使用:not选择器,fontawesome图标的样品是<i class="fa fa-bluetooth"></i> ,所以简单地可以使用:

*:not(i){
  font-family:Algerian;
}

这将这个家族适用于除与标签名称的元素在文档中的所有元素<i>你也可以做到这一点的类:

*:not(.fa){
  font-family:Algerian;
}

这将这个家族适用于除与类“FA”是指fontawesome默认类的元素在文档中的所有元素,你也可以针对多个类是这样的:

*:not(i):not(.fa):not(.YourClassName){
  font-family:Algerian;
}


Answer 4:

* { font-family: Algerian; }

通用选择*指的是任何元素。



Answer 5:

确保移动设备不会与通用选择沿着使用重要的改变与他们的默认字体的字体*:

* { font-family: Algerian !important;}


Answer 6:

由于不同的字体很可能是由浏览器表单元素已经被定义,这里有2种方式到处使用这个字体:

body, input, textarea {
    font-family: Algerian;
}

body {
    font-family: Algerian !important;
}

我们还会还是像前/码,大骨节病等元素等宽字体,但是,如果你使用这些内容,你最好使用等宽字体出现。

重要提示:如果很少有人有这个字体安装在他们的操作系统,然后在列表中的第二字体将被使用。 在这里,你没有定义第二字体,以便serif字体默认将被使用,而这将是时报,宋体也许除了在Linux上。
两个选项有:使用@字体面,如果您的字体是免费使用的下载字体或加回退(补):第二,第三,等最后一个默认的家庭(无衬线,草书(*),等宽或衬线)。 首先,用户的操作系统上存在的名单将被使用。

(*)在Windows默认的草书是Comic Sans字体。 除非你想吓吓Windows用户,不这样做:)这个字体是除了你的孩子的生日在那里的欢迎可怕。



Answer 7:

好了,所以我是有这个问题,我尝试了几种不同的选择。

我使用的字体是Ubuntu的李,我在工作目录中创建一个字体文件夹。 根据该文件夹的字体

我能够运用它......最终这是我工作的代码

我想这适用于我的整个网站,所以我把它放在CSS文档的顶部。 以上所有div标签(这不是问题,只要知道你指定的任何单个字体发表您的脚本将优先考虑)

@font-face{
    font-family: "Ubuntu-LI";
    src: url("/fonts/Ubuntu/(Ubuntu-LI.ttf"),
    url("../fonts/Ubuntu/Ubuntu-LI.ttf");
}

*{
    font-family:"Ubuntu-LI";
}

如果我当时就想我所有的H1标签的别的东西可以说SANS的Sarif我会做类似

h1{
   font-family: Sans-sarif;
}

从这种情况下,只有我的H1标签将是SANS-的Sarif字体和我的页面的其余部分将是Ubuntu的-LI字体



Answer 8:

请把这个在你的页面(S),如果“身体”需要使用1和相同的字体的头:

<style type="text/css">
body {font-family:FONT-NAME ;
     }
</style>

标签之间的所有内容<body></body>将具有相同的字体



Answer 9:

在引导,网络督察说的标题设置为“继承”

所有我需要我的页面设置为新字体被

div, p {font-family: Algerian}

这是在.scss



Answer 10:

*{font-family:Algerian;}

这个网站为我工作。 添加到画布设置在WordPress。

看起来很酷 - 谢谢!



文章来源: Applying a single font to an entire website with CSS