使用CSS将单个字体应用于整个网站

Question

我想在整个网站上使用一个名为"Algerian"的字体.所以,我需要更改所有HTML标签,我不想为不同的标签编写不同的代码,例如:

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

下面写的方法也非常不鼓励:

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

Answer 1

*{font-family:Algerian;}

这样做

Answer 2

将font-family声明放入body选择器:

body {
  font-family: Algerian;
}

然后,页面上的所有元素都将继承此font-family(当然,除非您稍后覆盖它).

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;}