如果我在 url 中有 2 `/`，CSS 不会加载答案

【问题标题】：Css does not load if I have 2 `/` in the url如果我在 url 中有 2 `/`，CSS 不会加载
【发布时间】：2014-10-12 09:21:51
【问题描述】：

我有这个 .htaccess 文件：

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^(.*)$ index.php?url=$1 [QSA,L]
</IfModule>

在我的 index.php 中，我有这个：

<!DOCTYPE HTML>
<?php
include "php/config.php";
include "php/RemoteAddress.php";

$remoteAddress = new RemoteAddress();

$ip = $remoteAddress -> getIpAddress(); // The clients ip address;
$tid = date( "Y-m-d_H-i-s" ); // A string representing the time

$fir = "hjem";
$sec = "";

$tot = isset( $_GET[ 'url' ] ) ? $_GET[ 'url' ] : "";
$tot = str_replace( "#", "", $tot );
$split = explode( "/", $tot );
if( isset( $split[0] ) && $split[0] !== "" ) $fir = $split[0];
if( isset( $split[1] ) && $split[1] !== "" ) $sec = $split[1];

if( $fir == "hjem" )
{
    $page = "home.php";
}
else if( $fir == "regler" )
{
    $page = "rules.php";
}
else if( $fir == "nyheter" )
{
    $page = "news.php";
}
else if( $fir == "om" )
{
    $page = "about.php";
}
else if( $fir == "kontakt" )
{
    $page = "contact.php";
}
else 
{
    $page = "page_not_found.php";
}

include 'php/content/header.php';
echo "\n".'        <div id="contents">'."\n";
include "php/content/".$page;
echo "\n".'        </div>';
include 'php/content/footer.php';
?>

问题是如果我有 URL localhost/hjem 它可以完美运行，但如果我有 localhost/hjem/ 或 localhost/hjem/info 浏览器不会加载 css 文件。

谁能告诉我为什么？我该如何解决这个问题？

编辑：

来自浏览器的源代码：

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8">
    <title>Nordbyen</title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
    <div id="header">
        <div>
            <div class="logo">
                <a href="hjem"></a>
            </div>
            <ul id="navigation">
                <li class="active">
                    <a href="hjem">Hjem</a>
                </li>
                <li>
                    <a href="regler">Regler</a>
                </li>
                <li>
                    <a href="nyheter">Nyheter</a>
                </li>
                <li>
                    <a href="om">Om</a>
                </li>
                <li>
                    <a href="kontakt">Kontakt</a>
                </li>
            </ul>
        </div>
    </div>
    <div id="contents">

        <style>
            table { 
                border-spacing: 0;
                border-collapse: collapse;
            }
        </style>
        <div id="tagline" class="clearfix">
            <h1>Nordbyen - Norsk Datafreak Forum</h1>
            <div>
                <p>
                    Jeg har startet på et nytt prosjekt, et norsk forum for forskjellige Java prosjekter.
                </p>
                <p>
                    Ideén bak dette er å skape et lite miljø for de norske som enten kan eller ønsker å lære <a href="http://no.wikipedia.org/wiki/Java_(programmeringsspr%C3%A5k)" target="_blank">Java</a> 
                </p>
                <p>
                    Dette er bare startfasen, så jeg vet ikke hvordan dette vil bli, men håper på både en bra og inspirerende side samt mange aktive medlemmer
                </p>
            </div>
            <div>
                <p>
                    Han du tro på prosjektet og ønsker du å delta? Bli med å bygge opp og vedlikeholde prosjektet ved å kontakte ...:
                </p>
                <table>
                    <tr>
                        <td><p>Kontakt meg på:</p></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td><p>Skype:</p></td>
                        <td><p>...</p></td>
                    </tr>
                    <tr>
                        <td><p>Facebook:</p></td>
                        <td><p>( <a href="https://www.facebook.com/..." target="_blank">...</a> )</p></td>
                    </tr>
                    <tr>
                        <td><p>Mail:</p></td>
                        <td><p>...</p></td>
                    </tr>
                </table>
            </div>
        </div>
    </div>        
    <div id="footer">
        <div class="clearfix">
            <p>
                © 2014 .... All Rights Reserved.
            </p>
        </div>
    </div>
</body>
</html>

【问题讨论】：

发布php/content/header.php的内容或HTML输出。
添加来自浏览器的源

标签： php html css apache .htaccess

【解决方案1】：

您的 css 链接是“css/style.css”。这是一个相对网址。相对于什么？是的，它与浏览器地址栏中的 url 相关。如果你访问localhost/hjem，那么前缀是localhost/，你请求的页面是hjem。当您访问localhost/hjem/ 时，前缀为localhost/hjem/。它尝试加载localhost/hjem/css/style.css，这显然失败了。

你有两个选择：

使用绝对路径。您可以使用/css/style.css。这将相对于您的域的根目录加载它，在本例中为 localhost/css/style.css。
您可以使用 base-html 标记，如下所示：<base href="/"> (mdn)。这将加载相对于基本标记的 href 元素的任何相对 url，从而加载 localhost/css/style.css。

【讨论】：

这解决了我的问题:)

【解决方案2】：

而不是 css 的相对 url 尝试绝对 url。我认为问题存在于相对地址。

像这样：

<link rel="stylesheet" href="http://yoursite.com/PATH_TO_CSS_FILE" type="text/css">

【讨论】：

请问你在href部分放了什么？
我加了一个 / 所以它变成了/css/style.css。