问

如何使用CSS将"Ubuntu Font Family"添加到我的网站？

石头1988030450 发布于 2023-02-07 17:43

css

如何在我的网站的CSS编辑器中添加Ubuntu字体系列？这是我已经拥有的字体和标题,但不想要我当前的字体,我想要Ubuntu字体.

/* ##### Common Styles ##### */

body {
  color: black;
  background-color: white;
  font-family: "times new roman", times, roman, serif;
  font-size: 12pt;
  margin: 0;
  padding: 0;
}

acronym, .titleTip {
  font-style: italic;
  border-bottom: none;
}

要么

/* ##### Header ##### */

#header {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid black;
}

.headerTitle {
  font-size: 200%;
  margin: 0;
  padding: 0 0 0.5ex 0;
}

.headerTitle a {
  color: black;
  background-color: transparent;
  font-family: "trebuchet ms", verdana, helvetica, arial, sans-serif;
  font-weight: normal;
  text-decoration: none;
}

.subHeader {
  display: none;
}


/* ##### Side Bars ##### */

#side-bar {
  display: none;
}


/* ##### Main Copy ##### */

#main-copy {
  text-align: justify;
  margin: 0;
  padding: 0;
}

#main-copy h1 {
  font-family: "trebuchet ms", verdana, helvetica, arial, sans-serif;
  font-size: 120%;
  margin: 2ex 0 1ex 0;
  padding: 0;

我在哪里添加Ubuntu字体系列？我是否插入了错误的代码来帮助你,帮助我？

1 个回答

导入字体

首先,您必须确保您的网站具有该字体,以防普通用户访问您的网站时没有.

选项1 - 从外部提供商导入

您可以从Google字体等外部字体主机导入整个字体文件和设置.只需将此代码放在HTML中即可从外部导入:
```
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Ubuntu:regular,bold&subset=Latin">
```
选项2 - 将其存储在您的服务器中您可以下载然后将字体文件上传到您的服务器,然后通过@font-face您的CSS 导入它们.在此示例中,您的字体文件的位置将是http://example.com/fonts/ubuntu.woff. @font-face { font-family: 'Ubuntu'; font-style: normal; font-weight: 400; src: local('Ubuntu'), url(http://example.com/fonts/ubuntu.woff) format('woff'); } 使用字体然后,您必须指定要使用该字体的位置.只需添加Ubuntu到您的font-family列表中: body { font-family: Ubuntu, "times new roman", times, roman, serif; } 此示例代码将为HTML页面中的每个文本提供Ubuntu字体(如果可用).
2023-02-07 17:48 回答手机用户2702932960



    
    
        今天，你开发时遇到什么问题呢？
        立即提问
    

    
        热门标签

如何使用CSS将"Ubuntu Font Family"添加到我的网站？

导入字体

选项1 - 从外部提供商导入

选项2 - 将其存储在您的服务器中

使用字体