我的 HTML 文件不会链接到其他 HTML 文件或 CSS答案

【问题标题】：My HTML file won't link to other HTML files or CSS我的 HTML 文件不会链接到其他 HTML 文件或 CSS
【发布时间】：2021-11-15 02:45:25
【问题描述】：

我正在使用 Sublime text 编写一些 HTML 和 CSS 文件。我已经创建了我的 index.html：

<!DOCTYPE html>
<html lang="en">
<head>

  <!--  Meta  -->
  <meta charset="UTF-8" />
  <title>RainyDayBakes</title>

  <!--  Styles  -->
  <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>



  <h1 style="text-align:center">RainyDayBakes</h1>
  <nav style="text-align:center">
    <a href=”C:\Users\sarah\Documents\Simmons\CS-321\page1.html”> About </a>
    <a href=”page2.html”> Menu </a>
    <a href=”page3.html”> Gallery </a>
    <a href=”page4.html”> Order </a>
    <a href=”page5.html”> Contact Us </a>
  </nav>

  <img src="cake.png" alt="oreo crumble cake" class="center">

  <h3>Welcome to RainyDayBakes!</h3>
  <p>We are a local bakery specializing in creative cakes, cupcakes and cookies!</p>
  <p>In addition to being open daily we also offer custom ordered confections.</p>

  <!-- Scripts -->
  <script src="scripts/index.js"></script>
</body>

<footer>
</footer>
</html>

我的 page1.html：

<!DOCTYPE html>
<html>
  <head>

    <meta charset="UTF-8" />
    <title>This is Page One </title>

  </head>
  <body>
  </body>
  <footer>
  </footer>
</html>

还有我的 style.css：

<style>
    h1 {
        color:red;
    }
</style>

当我尝试在 Chrome 中运行 index.html 时，指向 page1.html 的链接说它不存在，并且 CSS 不会显示。它们都在同一个文件夹中，我已经保存了所有文件，并且我正在 Chrome 上运行。我发现的所有其他解决方案都是指拼写错误，目录不同等，但如上所述，它们都在同一个文件夹中，我没有注意到拼写错误（但是当你是太接近你的代码）。

【问题讨论】：

标签： html css

【解决方案1】：

首先，您甚至没有在代码中的任何地方使用标签，所以这就是样式没有显示的原因。其次，如果它们在同一个文件夹中，只需将您的关于页面链接到 page1.html；不是完整的目录列表。

【讨论】：

我最初只是简单地使用 page1.html（如其他示例链接中所示）但它不起作用，所以我按照另一个页面上的建议包含完整目录。

【解决方案2】：

您在链接的 href 属性中使用了印刷引号，这不起作用。将它们更改为常规引号。

【讨论】：

【解决方案3】：

让链接改为这种方式 href=”page1.html”

【讨论】：

【解决方案4】：

您可能想在所有页面上放置指向 CSS 文件的链接，但我在 page1.html 上看不到它您可能已经知道此资源，但我提一下以防万一：@ 987654321@ 非常方便快速参考大量 HTML/CSS 问题。

【讨论】：

【解决方案5】：

所以你有两个问题：

对于 page1.html，建议将 file:// 或 file:/// 添加到 href 元素的开头，或者可能重新键入该行，因为其他链接有效
对于您的 CSS，删除标记，它用于将样式放入 HTML 文件中（嵌入）

【讨论】：

【解决方案6】：

这不是您的代码的问题。我也遇到了同样的问题，我最近发现问题可能出在您正在使用的 IDE 上。我正在使用 stackblitz 并收到相同的输出。但是，当我切换到在线编译器并逐字复制并粘贴具有相同文件名的代码时，代码开始正常工作。尝试使用在线编译器，看看效果如何。它对我有用。

我使用的编译器是： https://www.onlinegdb.com/

确保使用右上角的语言下拉菜单将语言切换为 HTML。

【讨论】：