为什么我的 CSS 在索引之外的其他页面上不起作用？

Question

I'm working in Adobe Dreamweaver on a simple text-and-option-buttons game right now.我现在正在使用 Adobe Dreamweaver 开发一个简单的文本和选项按钮游戏。 The index serves as the first part of the story and I've linked my external CSS file at the top, which sets text on the left of the screen and an image and option buttons on the right, while also, you know, styling things.索引作为故事的第一部分，我在顶部链接了我的外部 CSS 文件，它在屏幕左侧设置文本，在右侧设置图像和选项按钮，同时，你知道，设置样式. The buttons link to forking 'path' files (path1, path2, etc) which are exactly like the index in style but vary in story text and option text.这些按钮链接到分叉的“路径”文件（路径 1、路径 2 等），这些文件在风格上与索引完全一样，但在故事文本和选项文本方面有所不同。 On my index page, the CSS works, but whenever I preview the different path pages, it doesn't appear.在我的索引页面上，CSS 有效，但每当我预览不同的路径页面时，它都不会出现。 Weird thing is, I literally copied and pasted the link to the CSS file from my index page to my path1 and path2 files.奇怪的是，我从我的索引页面复制并粘贴了 CSS 文件的链接到我的 path1 和 path2 文件。

At first I thought this could have been because I used the Dreamweaver template feature on the path1 file, so I created path2 without use of the template to see if that was the problem, but that didn't fix anything.起初我认为这可能是因为我在 path1 文件上使用了 Dreamweaver 模板功能，所以我在没有使用模板的情况下创建了 path2 以查看是否是问题所在，但并没有解决任何问题。 Both path1 and path2 appeared without CSS. path1 和 path2 都没有出现 CSS。

This is my code at the moment:这是我目前的代码：

<title>Path 2</title>
<link rel="stylesheet" href="stylesheets/mpStyles.css">
<link rel="stylesheet" href="https://use.typekit.net/kxy7nko.css">
<script type="text/javascript" src="mpScripts.js"></script>
</head>

<body>
    <main>
        <section class="leftsection">
            <article> 
                <div class="story-section">
                    <p>New text </p>
                </div>
            </article>
        </section>
        <section class="rightsection">
            <article>
    <!--- etc etc -->

(And here's index.html vvv) （这里是index.html vvv）

<title>Midnight Project</title>
<link rel="stylesheet" href="mpStyles.css">
<link rel="stylesheet" href="https://use.typekit.net/kxy7nko.css">
<script type="text/javascript" src="mpScripts.js"></script>
</head>

<body>
    <main>
        <section class="leftsection">
            <article> 
                <div class="story-section">
                    <p>The place looks no more abandoned than the rest of the city. You know you're taking a risk by going another night without a roof over your head, so... </p>
                </div>
            </article>
        </section>
        <section class="rightsection">
            <article>
<!--- etc, etc -->

I saw a question similar to this and it was suggested to type a path like this: (link rel="stylesheet" href="/stylesheets/mpStyles.css") but that didn't work either.我看到一个与此类似的问题，建议输入这样的路径：(link rel="stylesheet" href="/stylesheets/mpStyles.css") 但这也不起作用。 I just started using HTML about four months ago, so bear with me.我大约四个月前才开始使用 HTML，所以请耐心等待。 It's probably something super obvious that I'm missing.这可能是我失踪的非常明显的事情。

Answer 1

Change your reference to your CSS file to include a preceding forward slash:将您对 CSS 文件的引用更改为包含前面的正斜杠：

<link rel="stylesheet" href="/stylesheets/mpStyles.css">

If this does not work, this suggests that your root directory is set to something other than the folder intended.如果这不起作用，则表明您的根目录设置为不同于预期文件夹的目录。

If you update the above link to the below does this work?如果您将上面的链接更新到下面，这是否有效？ Obviously replacing project-name with the name of your project folder.显然用项目文件夹的名称替换项目名称。

<link rel="stylesheet" href="/project-name/stylesheets/mpStyles.css">

为什么我的 CSS 在索引之外的其他页面上不起作用？

问题描述

1 个解决方案

解决方案1
1 2020-05-15 21:42:10

为什么我的 CSS 在索引之外的其他页面上不起作用？

问题描述

1 个解决方案

解决方案1 1 2020-05-15 21:42:10

解决方案1
1 2020-05-15 21:42:10