Question

这是我第一次在这里问一个问题，我在使用我正在做的网站时遇到了一些麻烦。

我想要一个通用的页眉和页脚系统，所以我不必在每一页上重做它。我正在使用bootstrap 3来设计我的网站。之前我使用过bootstrap没有问题，仅使用HTML。但是现在，我拥有php中的所有东西，在这种情况下主要是header.php，footer.php和index.php。我可以使用include函数将header.php和footer.php添加到我的index.php文件中，但是当我尝试自定义导航栏颜色时，事情就会停止工作。我做了一个＆＃34; styles.css＆＃34;用我的＆＃34; .navbar-custom＆＃34;文件类，但显然当我在我的代码中调用它时它没有被链接。任何想法为什么它可能无法正常工作？为什么忽略了/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

我期待导航栏的背景颜色至少变为黑色或我输入的任何颜色＆＃34; background-color＆＃34;。我只是得到一个空白的导航栏，奇怪的是，蓝色文本。

以下是其呈现方式的屏幕截图：

Website navbar screenshot

感谢您的耐心等待！祝你有愉快的一天！

Answer 1

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

See the working example

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

PHP中的Universal Header会导致多个CSS样式表出现问题

1 个答案: