php - PHP 中的通用 header 存在多个 CSS 样式表问题

标签 php html css twitter-bootstrap styling

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

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

我是 php 新手,我正在自学,这个网站是一个测试元素。

这是每个文件的代码:

标题.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>           

页脚.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>

索引.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");
?>

样式.css

//Extra Styles

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

我希望至少导航栏的背景颜色变为黑色或我在“背景颜色”上输入的任何颜色。我只是得到一个空白的导航栏,奇怪的是,还有蓝色文本。

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

Website navbar screenshot

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

最佳答案

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

See the working example

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

关于php - PHP 中的通用 header 存在多个 CSS 样式表问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36583353/

相关文章:

html - 如何使用CSS在表单中创建两列

javascript - AngularJS ex.com/forum?id=1 到 ex.com/#/forum?id=1

php - 是否可以验证 Composer 中的供应商文件夹完整性?

javascript - 如何从 html 表单提交传递 json 对象

html - 扩展 Markdown 解析器以呈现自定义代码块

javascript - HTML/CSS/JS (JQuery) - 可拖动模式重新调整窗口宽度/高度

html - hr 通过 css 处理图像

php - 嵌套的 while 循环不起作用,而是显示意外的 '}'

html - 从 Python CGI 脚本生成的 HTML 页面引用 css

javascript - 如何将内部 JavaScript 文件链接到 GitHub 中的 HTML 文件