PHP 中的通用 Header 存在多个 CSS 样式表问题

Question

这是我第一次在这里提问，我正在做的网站遇到了一些问题。

我想要一个通用的 header 和页脚系统，这样我就不必在每一页上都重做。我正在使用 bootstrap 3 来设计我的网站。我以前使用 bootstrap 没问题，只使用 HTML。但是现在，我在 php 中拥有所有内容，在这种情况下主要是 header.php、footer.php 和 index.php。我可以使用包含函数将 header.php 和 footer.php 添加到我的 index.php 文件中，但是当我尝试自定义导航栏颜色时，一切都停止了。我用我的“.navbar-custom”class 创建了一个 "styles.css" 文件，但显然当我在我的代码中调用它时它没有被 linked。任何想法为什么它可能不起作用？为什么 link 到 /css/styles.css 被忽略了？

我是新手php，我正在自学，这个网站是一个测试项目。

这是每个文件的代码：

header.php

<!DOCTYPE html>
<html>
    <head>
        <title>Sitio Oficial de MMOBurger</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta charset="UTF-8">       
        <link href="/css/bootstrap.min.css" type="text/css" rel="stylesheet">
        <link href="/css/styles.css" type="text/css" rel="stylesheet">
</head>
<body>
    <div class="navbar navbar-custom navbar-static-top">
        <div class="container">
            <a class="navbar-brand" href="http://mmoburger.com">MMOBurger</a>

            <button class="navbar-toggle" data-toggle = "collapse" data-targer = ".navHeaderCollapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>

            <div class="collapse navbar-collapse navHeaderCollapse">
                <ul class="nav navbar-nav navbar-left">
                    <li><a href="http://mmoburger.com">Inicio</a></li>
                    <li><a href="#">Blog</a></li>
                    <li><a href="#">Foro</a></li>
                    <li><a href="#">Tienda</a></li>
                </ul>                       
            </div>
        </div>
    </div>

footer.php

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
        <script src="js/bootstrap.js"></script>
    </body>
</html>

index.php

<?php
 /* 
 *Website designed and created by Jose Antonio Montes, aka NeoAnthony
 *All rights reserved MMOBurger S.A. 
 */
 include ("header.php");
 ?>

<div class="container">
    <h1>
        Hello World! 
        <div class="glyphicon glyphicon-copyright-mark"></div>
    </h1> 
</div>

<?php
include ("footer.php");
?>

styles.css

//Extra Styles

//NAVBAR COLORS
.navbar-custom {
background-color:#000;
color:#269abc;
border-radius:0;
}
//END NAVBAR COLORS

我希望导航栏的背景颜色至少变为黑色或我在 "background-color" 上输入的任何颜色。我只是得到一个空白的导航栏，奇怪的是，蓝色文本。

这是它如何呈现的屏幕截图：

Website navbar screenshot

感谢您的耐心等待！祝你有美好的一天！

Answer 1

正如@mikehomme 在评论中所说，您的评论 CSS 格式错误。应该是这样的/* your comment */

See the working example

蓝色文本不是来自您的 CSS 代码，而是来自 bootstrap 导航栏链接的默认颜色文本。

PHP 中的通用 Header 存在多个 CSS 样式表问题

Multiple CSS Stylesheets trouble with Universal Header in PHP

html

css

php

styling

twitter-bootstrap