javascript - HTML 和 CSS 文件中的 URL 路径

Question

也许这个问题的标题让你有点困惑，但我会详细解释。

假设您正在开发一个站点(PHP 脚本)，该站点在 css 中包含图像、js 文件和背景图像 url。如果购买它的用户将它放在如下子文件夹中，则需要使其工作:

www.example.com/subfolder

或者当他把它放在www.example.com

如果我像这样在我的 CSS 中使用背景图片的路径:

background: url(/assets/img/thumbs-up.png) no-repeat;

如果用户将脚本放在 www.example.com 中，这将起作用，但如果他放在 www.example.com/subfolder 中，浏览器将请求 www.example.com/assets/img/thumbs-up.png 而不是 www.example.com/subfolder/assets/img/thumbs-up.png

这通常是用这个解决的

background: url(assets/img/thumbs-up.png) no-repeat;

但是不，在我的例子中，浏览器请求的是这个 url

http://www.example.com/subfolder/assets/css/assets/img/thumbs-up.png

这部分，assets/css是CSS文件所在的地方。

我用

解决了这个问题

background: url(../../assets/img/thumbs-up.png) no-repeat;

这在根 www.example.com 和 www.example.com/subfolder 中有效但这是一种好的做法吗？

对于 JS 文件，我包含这样的脚本

<script src="assets/js/single_load.js"></script>

这是有效的，因为具有此代码的文件位于脚本的根目录中。(http://www.example.com/index.php 或 http://www.example.com/subfolder/index.php 正在调用它，如果名为 JS 的子文件夹中的文件我想我必须多次添加 ../ ，具体取决于文件所在的子文件夹数量)

对此有什么想法和指南吗？

Answer 1

在所有 PHP 脚本中为您的 CSS 文件使用同一个路径。

图像的路径将位于您的 CSS 路径，而不是 PHP

例如:

- index.php
- subfolder
    --index.php
-assets
    --css
        ---style.css
    --img

样式.css

background: url(../assets/img/thumbs-up.png) no-repeat;

配置.php

<?php
$root_path = "www.example.com";
//OR $_SERVER["REQUEST_URI"]; if you have one index.php

根index.php

<?php include "config.php"; ?>
<link href="<?php echo $root_path;?>/assets/css/style.css">

子文件夹/index.php

<?php include "config.php"; ?>
<link href="<?php echo $root_path;?>/assets/css/style.css">