我想用背景图片css创建一个div:
#mydiv {
background-image:url('/public/images/foo.png');
background-repeat: repeat-x;
}
现在,我不能在css中使用路由,因此我必须使用相对路径,否则如果安装在非根路径,我的应用程序将会中断。
有解决方法吗?像
这样的东西background-image:url('@{publicFolder}/images/foo.png');
我确实发现一年前this thread声称这是不可能的。这仍然是这样吗?
编辑:我知道我可以在页面中内联css,这不是一个真正可以接受的解决方案,而是一种解决方法。
答案 0 :(得分:12)
由于play框架编译/ public中的所有文件,我在css中使用以下语句来访问背景图像。
background: url("/assets/images/my-image-background.jpg");
到目前为止它对我有用,但不确定它是否是一个好习惯!希望它可以提供帮助。 欢呼声。
答案 1 :(得分:9)
路径始终来自样式表。那你为什么不使用相对路径呢?
示例,您的css位于/public/css/
,因此您的css文件中的路径必须为../images
。那就是它。
但也许less.css有类似于你正在寻找的东西。
答案 2 :(得分:7)
周围/是/可能的方式。
问题是CSS文件是静态的,所以Play!对他们没有任何作用 - 除了向客户提供服务。
只需将您的css文件转换为视图,编写一个通用控制器,将文件名作为参数,它们将作为播放服务!模板。
(beware:PSEUDOCODE!):
ROUTE:
get /css/{filename} Application.getCSS
CONTROLLER
class public void getCSS(filename)
{
renderTemplate(filename);
}
然后在你的CSS中你可以使用你想要的任何groovy模板功能。 安装路径以http.path in the conf
的形式提供这将是非常低效的,因此您必须添加nginx或类似的前端来执行一些缓存并为这些文件设置高过期值。
我不确定是否值得这样做只是为了避免相对路径!
我绝对认为相对路径更适合通用部署,并且您更有可能使用这种动态绝对方法来解决问题。
另一个重要的一点是,如果您喜欢绝对URL,那就没问题了。 我其实也是这样做的。
但是当我部署我的网络应用程序时(无论是玩游戏!,django,纯粹的wsgi还是其他什么),我总是把它放在网络前端。
通常是nginx。
这意味着您的游戏框架将是一个上游服务器,您可以使用:80端口上的URL执行所需的一切 - 并使用子域或子文件夹管理多个服务...
但是当你在自己的端口上访问你的播放应用程序时,一切都是绝对的。
最后,如果你正在部署Play!作为一场战争,我会感觉你选择了错误的框架或错误的部署模式!但是你的jboss或其他任何应用程序网络服务器都会在子文件夹上做一些魔术......
答案 3 :(得分:-2)
看看conf / routes文件。
在其中您将找到以下类似
的内容#将/ public文件夹中的静态资源映射到/ assets URL路径 GET / assets / *文件controllers.Assets.at(path =“/ public”,file)
这意味着为了访问公用文件夹中的资源, 你会在你的网址中使用/ assets。
所以在你的CSS中你做的 URL(/assets/images/myimage.png) 它会起作用。