Chrome 将 PHP 文件的内容加载到 CSS 文件中答案

【问题标题】：Chrome loading the contents of a PHP file into a CSS fileChrome 将 PHP 文件的内容加载到 CSS 文件中
【发布时间】：2015-10-12 15:03:33
【问题描述】：

我的网站在 Firefox 上完美加载，但 CSS 在 Chrome 上完全消失（尽管 html 加载）。

根据控制台，这似乎是因为 Chrome 正在将 index.php 的内容加载到 main.css 和 bannerTest.css 中，如下所示：

然而，在 Firefox 上，它会按预期加载 CSS：

我尝试过的方法不起作用：

清除我的历史记录/缓存/cookies
向标签添加文本/css。所有这一切都是使文本呈现在 Firefox 上有点奇怪。
css 和 html 验证。我修复了所有的分号等。还是不行。

有什么问题？我什至无法弄清楚要采取什么步骤来更深入地调查正在发生的事情，更不用说找出问题本身了。据我所知，控制台没有打印任何错误。

这里是 index.php：

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<title>Study</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">

<link href="css/bannerTest.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
<link href="css/main.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>

<style>
/**
 * The banner assumes a margin of 0px, but is not included
 * in banner.css to avoid collisions with other themes and 
 * admin bars.
 */
body {
  margin:0px;
}
</style>

<link rel="icon" type="image/ico" href="favicon.ico">

</head>

<body>
<?php

//Connect to MySQL database.
$host = "127.0.0.1";
$user = "root";
$password = "password";
$database = "database";

$r = mysql_connect($host, $user, $password);

if (!$r) {
    echo "Could not connect to server.\n";
    trigger_error(mysql_error(), E_USER_ERROR);
}

$query = "CREATE DATABASE IF NOT EXISTS " . $database;

mysql_query($query);

@mysql_select_db($database) or die("Unable to select database.");

$query="CREATE TABLE IF NOT EXISTS `groupcodes` (`groupcode` int(10) PRIMARY KEY, `usercode` int(10))";

mysql_query($query);

$userid = "";

?>

<div id="banner">
<div id="u-header-container">
<div class="container">
  <div class="row-fluid">
    <div id="home-link-container">
      <a id="home-link" href="http://csue.edu/">
        <span id="wordmark">U</span>
        <span id="university">UNIVERSITY</span>
      </a>
    </div>
  </div>  
</div>  
</div>
<div id="database-container">
    <header>
        <a href="index.php">
        <h4 id="logo">Computing Systems</h4>
        <h1 id="study_logo">Study</h1>
        </a>
    </header>
<div id="study">

    <form method="post" id="consent-form" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">

        <div class="wide-column">
            <p>
            By clicking the 'Acccept' button below, you hereby acknowledge the following:
            </p>

            <p>
            I am 18 years of age or older, live in the United States, and have a Google Drive or Dropbox account. 
            I have read this form and decided that I will participate in the project described above. 
            Its general purposes, the particulars of involvement, and possible risks and inconveniences have 
            been explained to my satisfaction. I understand that I can withdraw at any time.
            </p> 
        </div>
    <input type="text" name="email_input">
    <br>
    <input type="submit" value="Begin Study">
    </form>

</div>
</div>

</div>

</body>
</html>

【问题讨论】：

您介意提供页面的 URL 和 CSS 吗？
或者至少 index.php 代码:)
除了文件的源代码之外，“网络”选项卡上还有什么？是说响应是那个 HTML 吗？
如果 index.php 被提供而不是资源，它可能是因为例如 404，这取决于 Web 服务器的配置（是 Apache 吗？）。您能否粘贴 Firefox（工作）和 Chrome（不工作）发送的请求，以便我们检查是否有不同之处？（完整的标题会很棒）
尝试使用 css 文件的完整路径，而不是您在此处的相对目录。即 /peergroup/css/bannerTest.css 而不是 css/bannerTest.css

标签： php html css google-chrome firefox

【解决方案1】：

您误诊了问题。这是由于访问不同的 URL 来加载 HTML 文档，而不是使用不同的浏览器。您只是在切换 URL 的同时切换了浏览器。

查看第一张图片中加载的 URL：

http://localhost/peergroup/index.php/css/main.css

在 Chrome 中，您必须访问 http://localhost/peergroup/index.php/，而在 Firefox 中，您必须访问 http://localhost/peergroup/index.php（末尾没有 /）。

这会导致相对 URL 的计算方式不同。

一种解决方法是使用相对于站点根目录的 URL（即以 / 开头）。

【讨论】：

哇！你说得对。非常感谢您提供这背后的原因。