包含 PHP 文件的 CSS 未加载答案

【问题标题】：CSS Not Loading for Include PHP File包含 PHP 文件的 CSS 未加载
【发布时间】：2019-03-09 14:54:35
【问题描述】：

我不知道如何将样式应用于我作为模板包含的页面。我有以下目录结构：

app
│   index.php
│   styles.css   
│
└───include
│   │   mainmenu.php

我的 INDEX 文件如下所示

<?php
session_start();
?>
<!DOCTYPE html>
<html>
<head>
    <title>Learn Algorithm Tracing</title>
    <link rel="stylesheet" type="text/css" href="styles.css"</link>
</head>
<body>
<?php
include 'includes/menu.php';
?>
<h1>Welcome</h1>

CSS 在此页面中运行良好并且加载正常。但是，我无法理解如何将 CSS 样式应用于我的 mainmenu.php 文件。目前看起来是这样的。

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="../styles.css"/>
</head>
<body>
<p class="menuitem">HOME</p>
<p class="menuitem">I KNOW</p>
<p class="menuitem">I WANT</p>
<p class="menuitem">I GOT</p>
</body>
</html>

我添加了 ..\，因为它的样式存储在父目录中的主 CSS 文件中。但是，这里没有应用 menuitem 样式。我已经尝试了所有我能想到的组合，但我该怎么做呢？当 mainmenu.php 页面包含在 index.php 中时，如何将主样式表中的样式应用到我的页面

编辑：

有趣的是，当我包含索引页面中已经使用的一种样式时，它可以正常工作，但由于某种原因它不喜欢 menuitem 样式。这是CSS

body{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

h1 {
    font-family: "Verdana", sans-serif;
}

.maintext {
    font-family: "Arial", sans-serif;
}
.entryprompt{
    width: 50px;
}
.menuitem{
    font-family: "Arial Narrow", sans-serif;
    font-size: 16pt;
    width: 30px;
    margin: 10px;
}

【问题讨论】：

文件夹中有 CSS 吗？或者你是怎么使用“\..\styles.css”的
试试改成这个<link rel="stylesheet" type="text/css" href="../styles.css"/>
我认为问题可能出在其他地方。我已经按问题更新了
为什么会有include/mainmenu.php（树）和includes/menu.php（不在树中，而是在index.php）？

标签： php css

【解决方案1】：

尝试使用../styles.css 而不是\..\styles.css 并关闭

<link rel="stylesheet" type="text/css" href="../styles.css" />

【讨论】：

不行，PHPStorm好像不喜欢我关闭标签

【解决方案2】：

您在 html 中使用了错误的斜杠 link 标签将 \ 更改为 /，因此 CSS 导入将如下所示。

<link rel="stylesheet" type="text/css" href="../styles.css"/>

更新：

当您包含某个文件时，您应该使用包含它的文件的路径。试试这个。

<link rel="stylesheet" type="text/css" href="styles.css"/>

【讨论】：