如何使用 codeigniter 在 css 文件中设置 base_url() 以访问 css 文件中的 background_image_url？答案

【问题标题】：how to set base_url() inside css file using codeigniter, to access background_image_url inside css file?如何使用 codeigniter 在 css 文件中设置 base_url() 以访问 css 文件中的 background_image_url？
【发布时间】：2016-10-04 17:46:50
【问题描述】：

我正在使用 codeigniter，我加载了所有 css 文件，并且这些文件运行良好。我的目录结构是如下图所示：

我使用此代码加载了style.css：

<link rel="stylesheet" type="text/css" href="<?php echo base_url();?>assets/css/style.css">

所有样式属性都设置得很好并且可以正常工作。但之后我发现设置在 css 文件中的图像没有显示在我的网站上！我在 css 中的代码：

.social_nav li.facebook a{ background-image:url("images/socials.png"); background-position:0 -30px; background-size:270px 60px}

他们为background-image:url("images/socials.png"设置base_url()的任何程序也是如此

【问题讨论】：

图片，在 assets/css/images 或 assets/images 里面？
您是否设置了基本网址$config['base_url'] = 'http://localhost/project/'; 或您的域$config['base_url'] = 'http://www.example.com/';

标签： php css codeigniter

【解决方案1】：

由于 CSS 背景属性是相对于 CSS 文件的，你可以使用：

background: url("../../"); /* Becomes the base URL */

现在你可以从那里遍历路径：

background: url("../../assets/images/socials.png");

您也可以将其用作备用：

background: url("../images/socials.png");

【讨论】：

我添加了你解释的代码，但它仍然不起作用.. background: url("../images/socials.png");
@AbhijitKumbhar：检查你的控制台，我希望你得到图像的 404 url，请分享 url
删除返回目录代码(../) 后，当我检查浏览器控制台时，我发现图像链接 (localhost/myproject/assets/css/images/socials.png) 在打开此链接时我找到了图像，但它没有显示在我网站的 index.php 页面上
@AbhijitKumbhar：我建议在这里检查background-position:0 -30px; background-size:270px 60px; 可能有问题。因为链接没有破坏..根据您的评论，链接工作正常，Praveen，如果我错了，请纠正我
@devpro 同意你的观点！ :)我也强烈感觉图片损坏了。

【解决方案2】：

请注意，如果此图像 socials.png 在 assets/images 文件夹中可用，则您可以像这样使用：

.social_nav li.facebook a{ 
  background-image:url("../images/socials.png"); //one step back
  background-position:0 -30px; 
  background-size:270px 60px;
}

如果您在assets/css/images 中的图像比您的代码必须有效，您需要通过更改值或删除来检查这两个属性。

background-position:0 -30px;
background-size:270px 60px;

旁注：

也许，在这种情况下，您的文件已损坏，也可以使用不同的图像进行检查。

同时检查您的浏览器控制台，如果您提供的路径错误，您将获得此图像的 404 链接。

【讨论】：

我在浏览器中没有收到任何 404 错误，图像在此 (localhost/myproject/assets/css/images/socials.png) 链接上可用，但未显示在我的 index.php 页面上
@AbhijitKumbhar：这意味着，你需要检查这个background-position:0 -30px; background-size:270px 60px;
我检查了，也删除了，但没有工作:(
他们在 css 中是否有任何选项来设置基本 url，如 PHP 的基本 url 函数 "?"

【解决方案3】：

在得到帮助并最终理解我的愚蠢错误后，我找到了答案，除了 adblocker 我禁用之外，一切都正常工作，现在图像正在显示

【讨论】：