[分享]css中href链接后的字体

CSS 是一种用于创建可视化效果的样式表语言。在 CSS 中，使用 href 属性来连接字体，使网页中的文字可以呈现多种不同的字体风格。下面我们来看看如何使用 href 属性来连接字体。fontfac...

CSS 是一种用于创建可视化效果的样式表语言。在 CSS 中，使用 href 属性来连接字体，使网页中的文字可以呈现多种不同的字体风格。下面我们来看看如何使用 href 属性来连接字体。

@font-face {
    font-family: "MyFont";
    src: url("fonts/MyFont.ttf");
}
    
p {
    font-family: "MyFont", serif;
} 

在上面的代码中，我们先通过 @font-face 指定了一个名字为 "MyFont" 的字体，它的源文件在 fonts 文件夹中的 MyFont.ttf 字体文件。然后在 p 标签中，我们用 font-family 属性指定了该段文字使用 "MyFont" 字体，如果该字体不能正常显示，则使用默认的衬线字体。

除了本地文件，我们还可以通过链接网上的字体库来引入字体。

@font-face {
    font-family: "MyFont";
    src: url("https://fonts.googleapis.com/css?family=Open+Sans");
}
    
p {
    font-family: "MyFont", serif;
} 

在上面的代码中，我们通过链接 Google Font 字体库中的 Open Sans 字体来定义 "MyFont" 字体，然后在 p 标签中使用该字体。这样我们就可以使用更加丰富的字体效果来为我们的网页增添美观的视觉效果。