Fatal编程技术网
  • php/
  • Php Wamp服务器不显示css

Php Wamp服务器不显示css

php html css codeigniter

Php Wamp服务器不显示css,php,html,css,codeigniter,Php,Html,Css,Codeigniter,我在一个.css文件中创建了两个div，然后将该.css文件链接到一个php头文件中，如下所示 <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="css/headercss.css" type="text/css" media="screen" title="default"> </head> <body bgcolor="#F0F0F0"> &

我在一个.css文件中创建了两个div，然后将该.css文件链接到一个php头文件中，如下所示

<!DOCTYPE html>

<html>
<head>

<link rel="stylesheet" href="css/headercss.css" type="text/css" media="screen" title="default">

</head>


<body bgcolor="#F0F0F0">

<div class="div_menu">
<h1> asdasd </h1>
</div>

<div class="div_main">
我确信目录没有问题，因为当我简单地使用google chrome运行php文件时，一切都很好，但是当我尝试通过wamp服务器从localhost打开它时，除了h1标记之外，一切都消失了

任何帮助都将不胜感激

您需要确保从正确的相对位置调用css

因为这是一个PHP头文件，所以我假设您从不同的位置调用它（比如
/
，
/about
，
/otherfolder
，等等）

问题是，您当前的代码将查找当前文件夹中的css文件夹，而不是它实际所在的顶部文件夹

因此：

注意
/css/headercss.css的绝对位置-前面的
/
表示“从顶部”


编辑：原来OP正在使用CodeIgniter，应该重新提交他的问题，并加上这样的标签。
实际上，在您将所有问题传输到wampserver后，您的图像会更改其位置，因此您需要更改您设计的所有div的背景图像：url（“”）。然后VIOLA将出现
在wamp中为apache服务器使用端口80
打开开发人员工具并重新加载，单击网络选项卡并查找css文件，确保它（以及所有相关资源）返回HTTP 200“在chrome中工作正常，但不来自本地主机”是什么意思？您是在实时环境中在线测试，还是使用不同的程序访问您的本地主机？在线测试，但我的意思是没有css效果通过本地主机显示，但当我只需右键单击并使用google chrome打开php文件时，一切看起来都是正确的。为什么？我没有说它会工作，我说的是
确保它返回HTTP 200
。你得到了什么？当我简单地用google chrome打开，但使用localhost css时，一切都很好。打开开发人员控制台，查看css文件的返回代码-注意get调用试图找到它的位置（相对于它实际所在的位置）。我应该从哪里打开开发者控制台？如果问题出在目录上，那么为什么在使用google chrome打开时一切都很顺利？因为在chrome中，你没有解析PHP，而是将其呈现为HTML。试着把它放在那里，用chrome打开，它不会出现。在localhost中运行它，您将看到打印的“hello”。

@charset "utf-8";
/* CSS Document */


.div_menu{
background-image:url('table_header_options.jpg');
width:70%;
margin:auto;
height:50px;
}

.div_main{
background-color:#FFF;
margin:auto;
width:69.75%;
height:800px;
margin-top:15px;

border-width:1px;
border-style:solid;
border-bottom-color:#ddd;
border-right-color:#ddd;
border-top-color:#aaa;
border-left-color:#aaa;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-moz-box-shadow: 10px 10px 5px #888;
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px #888;
}