Question

在css中指定背景图片网址时，我们可以从配置条目中获取值。

今天我的服务器名称为http://imageserver，明天可能会更改为http://imagecacheserver。

如何在一个地方进行更改，以便无需更改所有css文件。

在.net方面，我从appsettings获取服务器URL。

Answer 1

如果您小心使用相对网址，这不是问题。考虑一下：

.testclass { background: url(http://mydomain.com/images/myimage.jpg); }

这很好 - 只要你仍然在mydomain.com上设置。另一种选择：

.testclass { background: url(/images/myimage.jpg); }

这将适用于您坚持使用的任何域，假设有/ images文件夹。只要你保持一致并且文件结构保持不变，你就可以开始了。所有这些都假设您在同一个域中托管图像和CSS / HTML。

Answer 2

您使用的是.Net MVC吗？即使您使用的是WebForms，也可以使用MVC（只需快速使用Google）。

无论如何，如果是这样，你可以在Global.asax中放入一个UrlRoute

routes.MapRoute(
                "ImageHandler",
                "images/{*fileName}",
                new { controller = "ImageHandler", action = "Handle", fileName = "" } 
            );

然后只需添加一个执行以下操作的“ImageHandler”控制器：

public class ImageHandlerController : Controller
    {
        public ActionResult Handle(string fileName)
        {
            return Redirect("http://myactualserver.com/imageshere/" + fileName);
        }

    }

然后，这会将所有HTTP GET请求从/ images / *重定向到动态URL。当然，您可以只是“jazz-up”上面的方法来使用您在AppSettings中使用的Url而不是硬编码的字符串。您可能还希望HtmlEncode'fileName'是安全的。

因此，无论文件实际位于何处，您的CSS代码现在都可以使用background-image: url("/images/blah.jpg")。

Answer 3

我有适合你的解决方案！它被称为LESS！ LESS是一个扩展CSS的CSS框架，允许您创建变量，混合和嵌套规则。 LESS使用CSS语法，因此您只需将变量添加到现有CSS中。

在你的情况下：

@path: "http://myserver.net/images";


body {
  background-image: url(%("%s/bg-body.jpg", @path));
}

然后你只需要编译你的CSS并将其上传到服务器。当您的图像服务器发生更改时，您只需更改变量，编译CSS并上传它。

当然，如果这只是一个图像是矫枉过正，但如果你有一个包含数百个声明的CSS，那么很高兴找到这样的解决方案。

您可以访问LESS网站http://lesscss.org/

Answer 4

如果您使用Apache作为Web服务器，您还可以创建一个反向代理，以便对'/ images / ...'的每个请求在内部重定向到'http://sever2.com/images/。。“

如何通过配置条目引用css中的背景图片网址

4 个答案: