我的 h1 標簽字體系列突然從 css 中的原始字體系列改變了

Question

我有一個 html 網站，我網站上的每個頁面的 css 都是一樣的。 今天我的首頁字體突然變了。 原來的字體系列是： font-family: "Alex Brush"; 但它變成了一些普通的字體系列。 我嘗試添加font-family: "Alex Brush"; 在頁面的頭部部分，但它不起作用。 我不知道為什么它顯示的字體與其他頁面上的字體不同。

我的CSS：

html, body {
  font-family: "Source Sans Pro", sans-serif;
  height: 100% !important;
  font-weight: 300;
  color: #444;
  position: relative;
  font-size: 14px;
  line-height: 1.5em;
}
html h1, html h2, html h3, html h4, html h5, body h1, body h2, body h3, body h4, body h5 {
  font-family: "Alex Brush";
  font-weight: 300;
  margin: 0px;
  letter-spacing: 2px;
  color: #555;
}

在下面提供我的頭部標簽：

<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">


    <meta name="author" content="Suave Digital">
    <link rel="apple-touch-icon" sizes="72x72" href="assets\images\apple-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="114x114" href="assets\images\apple-icon-114x114.png">
    <link rel="shortcut icon" type="image/png" sizes="32x32" href="assets\images\favicon-32x32.png">

    <title>The Nosh Bistro </title>

    <!-- Bootstrap core CSS -->
    <link href="assets/stylesheets/css/bootstrap.min.css" rel="stylesheet">

    <!-- font-awesome.css -->
    <link href="assets/stylesheets/css/fontawesome/font-awesome.min.css" rel="stylesheet">

    <!-- pe-icon.css -->
    <link href="assets/stylesheets/css/pe-icon/pe-icon-7-stroke.css" rel="stylesheet">
    <link href="assets/stylesheets/css/pe-icon/helper.css" rel="stylesheet">
    <link href="assets/fonts/flaticon/flaticon.css" rel="stylesheet">

    <!-- Fancybox -->
    <link href="assets/javascripts/fancybox/jquery.fancybox.css" rel="stylesheet">

    <!-- Slick -->
    <link href="assets/stylesheets/css/slick/slick.css" rel="stylesheet">
    <link href="assets/stylesheets/css/slick/slick-theme.css" rel="stylesheet">

    <!-- Animate -->
    <link href="assets/stylesheets/css/animate.css" rel="stylesheet">

<script>
window.onscroll = function() {
    growShrinkLogo()
  };

  function growShrinkLogo() {
    var Logo = document.getElementById("logo")
    if (document.body.scrollTop > 5 || document.documentElement.scrollTop > 5) {
      Logo.style.width = '72px';
    } else {
      Logo.style.width = '180px';
    }
  }
</script>

    <!-- Main CSS -->
    <link href="assets/stylesheets/css/style.css" rel="stylesheet">

    <!-- Font style -->

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#myModal").modal('show');
        });
    </script>
    <style>








    .modal-content{
      width: 440px;
    margin-left: 40px;
    margin-top: -15px;
    }
    .modal-header{
      height: 5px;
    }
    .peep{
      margin-top: -6px;
    }

    /* @media screen and (max-width: 768px) {


} */

    </style>



  </head>

我不知道我的首頁發生了什么。 我希望首頁上的 <h1> 標簽顯示“Alex Brush”字體。 有誰知道我的問題的解決方案，或者誰能告訴我如何更改內聯標簽中的字體系列？

這是我的 HTML 頁面。

Answer 1

似乎這兩個鏈接

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

覆蓋你默認的CSS。 所以在這兩個文件之后加載你的css文件或者使用!important和樣式

我也檢查了你的網站。 您的組件中沒有任何文件正在加載，請檢查服務器配置

Answer 2

您導入幾次相同的文件（jquery，bootstrap，...）。

在<head>你可以刪除：

<link href="assets\stylesheets\css\menu\bootstrap.min.css" rel="stylesheet"> 
(the second one not the first)

<script src="assets\stylesheets\css\menu\bootstrap.min.js"></script> (put this 
script on your footer with other script) and change "\" to "/" in the path.


<!-- Font style -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

並且，請在您的文件夾中將“stylesheets / css”更改為“stylesheets”並在里面創建一個帶有“css”的新文件夾，並放置所有文件。

Answer 3

當我檢查您的網站時，它似乎使用正確的字體系列（Alex Brush）用於h1標簽，嘗試清除瀏覽器的緩存

就像一個注釋，這里是你如何調試這些問題：

確保在頁面中正確導入字體
確保使用正確的字體系列名稱
確保您的樣式不被其他CSS代碼覆蓋。
清除瀏覽器的緩存

通過考慮上述說明，您將不會有任何問題。

我的 h1 標簽字體系列突然從 css 中的原始字體系列改變了

問題描述

2 個解決方案

解決方案1
0 已采納 2019-04-17 07:15:05

解決方案2
0 2019-04-17 07:58:25

解決方案3
0 2019-04-17 12:27:20

我的 h1 標簽字體系列突然從 css 中的原始字體系列改變了

問題描述

2 個解決方案

解決方案1 0 已采納 2019-04-17 07:15:05

解決方案2 0 2019-04-17 07:58:25

解決方案3 0 2019-04-17 12:27:20

解決方案1
0 已采納 2019-04-17 07:15:05

解決方案2
0 2019-04-17 07:58:25

解決方案3
0 2019-04-17 12:27:20