Question

所以，我正在尝试完成这个简单的任务，即将背景图像设置为图案并重复它。当我单独查看模板（而不是通过播放应用程序）时，它工作得很好。我必须错过一个简单的观点，希望你们/ gals可以帮助我。该文件是.png文件（binding_dark.png），位于文件夹中：binding_dark。这是我的代码：

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body style="background-image:url('binding_dark/binding_dark.png');background-repeat: repeat;">
    hello
</body>
</html>

Answer 1

看到模板在没有框架的情况下工作正常，它很可能与资产目录（binding_dark/binding_dark.png）的相对路径有关。我也遇到过这个问题，需要进行一些实验才能弄明白。

在标题中，它表示您正在使用Play Framework。使用Assets控制器将有助于通过资产的根路径缓解此问题。例如，在模板中使用@routes.Assets.at("binding_dark/binding_dark.png")（假设您的public文件夹中有一个名为binding_dark的子文件夹，如果没有，则表示您在routes.conf中更新了路径从Play应用程序中的公共目录到图像的完整路径。

如果您必须对资产的路径进行硬编码，并假设您在routes.conf文件中保留了“库存”资产路线，请尝试使用路径：/assets/binding_dark/binding_dark.png并查看是否有效。

此外，如果路径问题，您可以使用Chrome开发者工具控制台（设置 - ＆gt;工具 - ＆gt;开发人员工具 - >控制台），然后加载（或重新加载）页面，您应该在那里看到由于无法找到页面，页面无法正确加载资产等。

Answer 2

一个简单的解决方案是在css文件中包括以下几行

background-image: url("../binding_dark/binding_dark.png");
background-repeat: repeat;

在播放框架视图中使用设置背景图像时，您无需使用@routes.Assets.at()

无法添加模式作为背景图像播放框架

2 个答案: