Question

我正在使用Sublime文本编写一些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上运行。我发现的所有其他解决方案都涉及打错字，目录不同等，但是如上所述，它们都位于同一文件夹中，而且我没有注意到错字（但是当您遇到错字时完全有可能太接近您的代码）。

Answer 1

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

Answer 2

您在链接的href属性中使用印刷引号，该引号无效。将这些更改为常规报价。

Answer 3

让链接变成这种方式，href =“” page1.html”

Answer 4

您可能希望在所有页面上都放置一个指向CSS文件的链接，而您的page1.html上却看不到它。您可能已经知道此资源，但为避免您遇到这种情况，我会提到它：{ {3}}非常方便，可以快速参考很多HTML / CSS问题。

Answer 5

所以您有两个问题：

对于page1.html，建议在href元素的开头添加file：//或file：///，或者由于其他链接起作用而重新键入该行
对于您的CSS，请删除标记，该标记用于将样式放入HTML文件（嵌入式）中

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

5 个答案: