导航栏字体

Question

我需要一些帮助与自定义导航栏，我已经创建了一个电子邮件模板上的邮件黑猩猩。我不是一个程序员，但我已经设法创建了一个链接到我的网页的导航栏。但是，当前在导航栏中显示的字体是Times New Roman，我非常希望将其更改为Source Sans Pro。

当前代码如下所示：

<style>

ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}

li {
float: left;
}

li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

li a:hover {
background-color: #111;
}
</style>

要将当前字体更改为Source Sans Pro，需要添加哪些内容？

任何指导都将不胜感激。

Answer 1

您必须将其链接到您的HTML中

<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro&display=swap" rel="stylesheet">

然后在CSS中使用任何选择器(ID/Class/Element)

font-family: 'Source Sans Pro', sans-serif;

要使整个文档使用此字体，请执行以下操作：

<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro&display=swap" rel="stylesheet">
<style>

* {
  font-family: 'Source Sans Pro', sans-serif;
}

ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}

li {
float: left;
}

li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

li a:hover {
background-color: #111;
}
</style>