如何在 css URL 中使用相对/绝对路径?

发布于 2024-11-03 12:15:53 字数 453 浏览 1 评论 0原文

我有一个生产和开发服务器。 问题是目录结构。

开发:

  • http://dev.com/subdir/images/image.jpg
  • http://dev.com/subdir/resources/css/style.css

生产:

  • http://live.com/images/image.jpg
  • http://live.com/resources/css/style.css

我怎样才能拥有css 文件夹中的 style.css 在两台服务器上都使用background: url 属性的路径相同吗?有什么技巧可以用于相对路径吗?

I have a production and development server.
The problem is the directory structure.

Development:

  • http://dev.com/subdir/images/image.jpg
  • http://dev.com/subdir/resources/css/style.css

Production:

  • http://live.com/images/image.jpg
  • http://live.com/resources/css/style.css

How can I have a style.css in css folder that uses on both servers the same path for the background: url property? Is there a trick I can use with relative paths?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

听你说爱我 2024-11-10 12:15:53

该 URL 相对于 CSS 文件的位置,因此这应该适合您:

url('../../images/image.jpg')

相对 URL 返回两个文件夹,然后到 images 文件夹 - 只要结构相同,它就应该适用于这两种情况。

来自 https://www.w3.org/TR/CSS1/#url

部分 URL 是相对于样式表的源进行解释的,而不是相对于文档

The URL is relative to the location of the CSS file, so this should work for you:

url('../../images/image.jpg')

The relative URL goes two folders back, and then to the images folder - it should work for both cases, as long as the structure is the same.

From https://www.w3.org/TR/CSS1/#url:

Partial URLs are interpreted relative to the source of the style sheet, not relative to the document

随风而去 2024-11-10 12:15:53

就我个人而言,我会在 .htaccess 文件中修复此问题。您应该有权访问它。

如下定义 CSS URL:

url(/image_dir/image.png);

在 .htacess 文件中,输入:

Options +FollowSymLinks
RewriteEngine On
RewriteRule ^image_dir/(.*) subdir/images/$1

RewriteRule ^image_dir/(.*) images/$1

根据站点而定。

Personally, I would fix this in the .htaccess file. You should have access to that.

Define your CSS URL as such:

url(/image_dir/image.png);

In your .htacess file, put:

Options +FollowSymLinks
RewriteEngine On
RewriteRule ^image_dir/(.*) subdir/images/$1

or

RewriteRule ^image_dir/(.*) images/$1

depending on the site.

一杯敬自由 2024-11-10 12:15:53

我遇到了同样的问题...每次我想发布我的css..我都必须进行搜索/替换..并且相对路径对我来说也不起作用,因为相对路径从开发到生产是不同的。

最后厌倦了搜索/替换,我创建了一个动态 css,(例如 www.mysite.com/css.php)它是相同的,但现在我可以在 css 中使用我的 php 常量。类似的东西

.icon{
  background-image:url('<?php echo BASE_IMAGE;?>icon.png');
}

,让它动态化并不是一个坏主意,因为现在我可以使用 YUI 压缩器压缩它,而不会丢失我的开发服务器上的原始格式。

祝你好运!

i had the same problem... every time that i wanted to publish my css.. I had to make a search/replace.. and relative path wouldnt work either for me because the relative paths were different from dev to production.

Finally was tired of doing the search/replace and I created a dynamic css, (e.g. www.mysite.com/css.php) it's the same but now i could use my php constants in the css. somethig like

.icon{
  background-image:url('<?php echo BASE_IMAGE;?>icon.png');
}

and it's not a bad idea to make it dynamic because now i could compress it using YUI compressor without loosing the original format on my dev server.

Good Luck!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文