Question

我有Codeigniter项目文件，css文件在同一个子目录中，所以index.html上的代码如下所示：

<link href="bootstrap.min.css" rel="stylesheet">
<link href="shop-homepage.css" rel="stylesheet">

但CSS不会加载，在右键单击并查看源代码然后单击css链接后，我发现此来源：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>404 Page Not Found</title>
<style type="text/css">

::selection { background-color: #E13300; color: white; }
::-moz-selection { background-color: #E13300; color: white; }

body {
    background-color: #fff;
    margin: 40px;
    font: 13px/20px normal Helvetica, Arial, sans-serif;
    color: #4F5155;
}

a {
    color: #003399;
    background-color: transparent;
    font-weight: normal;
}

h1 {
    color: #444;
    background-color: transparent;
    border-bottom: 1px solid #D0D0D0;
    font-size: 19px;
    font-weight: normal;
    margin: 0 0 14px 0;
    padding: 14px 15px 10px 15px;
}

code {
    font-family: Consolas, Monaco, Courier New, Courier, monospace;
    font-size: 12px;
    background-color: #f9f9f9;
    border: 1px solid #D0D0D0;
    color: #002166;
    display: block;
    margin: 14px 0 14px 0;
    padding: 12px 10px 12px 10px;
}

#container {
    margin: 10px;
    border: 1px solid #D0D0D0;
    box-shadow: 0 0 8px #D0D0D0;
}

p {
    margin: 12px 15px 12px 15px;
}
</style>
</head>
<body>
    <div id="container">
        <h1>404 Page Not Found</h1>
        <p>The page you requested was not found.</p>    </div>
</body>
</html>

有人可以解释我的代码会发生什么吗？

Answer 1

使用相对于域而不是相对于页面的URL是明智的。

<link href="/bootstrap.min.css" rel="stylesheet" />
<link href="/shop-homepage.css" rel="stylesheet" />

另请遵循提供CSS，图像，脚本等静态资源的最佳做法：

Answer 2

解决后，更改所有链接到CSS：

<!-- Bootstrap Core CSS -->
<link href="<?php echo base_url();?>public/css/bootstrap.min.css" rel="stylesheet">

<!-- Custom CSS -->
<link href="<?php echo base_url(); ?>public/css/shop-homepage.css" rel="stylesheet">

并将config.php更改为：

$config['base_url'] = 'http://localhost/cidlab';

参考here 并感谢Google Chrome

php Codeigniter - CSS不会加载

2 个答案: