我现在正在Adobe Dreamweaver中开发一个简单的文本和选项按钮游戏。索引是故事的第一部分,我在顶部链接了外部CSS文件,该文件在屏幕左侧设置了文本,在右侧设置了图像和选项按钮,同时还对样式进行了设置。这些按钮链接到分叉的“路径”文件(path1,path2等),这些文件的样式与索引完全相同,但故事文本和选项文本有所不同。在我的索引页面上,CSS可以工作,但是每当我预览不同的路径页面时,它都不会出现。奇怪的是,我确实从索引页面复制了指向CSS文件的链接并将其粘贴到path1和path2文件。
起初我以为是因为我在path1文件上使用了Dreamweaver模板功能,所以我在不使用模板的情况下创建了path2来查看是否是问题所在,但这并不能解决任何问题。 path1和path2都没有CSS。
此刻是我的代码:
<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 -->
(这里是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 -->
[我看到了与此类似的问题,建议输入这样的路径:(link rel =“ stylesheet” href =“ / stylesheets / mpStyles.css”),但这也不起作用。我大约四个月前才开始使用HTML,所以请耐心等待。我想念的东西可能很明显。
更改对CSS文件的引用以包含前面的正斜杠:
<link rel="stylesheet" href="/stylesheets/mpStyles.css">
如果这不起作用,则表明您的根目录设置为目标文件夹以外的其他目录。
如果将上面的链接更新为下面的链接,这行得通吗?显然用项目文件夹的名称替换了项目名称。
<link rel="stylesheet" href="/project-name/stylesheets/mpStyles.css">
您正在使用文件[[mpStyles.css的相对路径,因此了解您的html文件是否都在同一文件夹中非常重要。如果是,则相对路径应该全部相同。
奇怪的是,我确实从索引页面复制了指向CSS文件的链接并将其粘贴到我的path1和path2文件。
不过,您提供的代码中的路径(链接)并不相同。
非索引页:
<link rel="stylesheet" href="stylesheets/mpStyles.css">
index.html:
<link rel="stylesheet" href="mpStyles.css">
如果您的CSS在index.html上工作,则mpStyles.css与index.html在同一文件夹中。因此解决方法是更改:
<link rel="stylesheet" href="stylesheets/mpStyles.css">
with:
<link rel="stylesheet" href="mpStyles.css">
对于您的非索引文件。