Cloud9 IDE + Rails 应用程序:CSS 背景图像未显示在 .erb 页面上



这个问题已经问了很多次,但我无法解决。

我正在尝试在 Cloud 9 IDE 上的 Ruby on rails 应用程序页面上显示图像,但图像不会出现。

.CSS

.hero-image {
/* The image used */
background-image: url("images/banner.jpg");
/* Set a specific height */
height: 50%;
/* Position and center the image to scale nicely on all screens */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
}

.erb 页面

<div class="hero-image">
</div>

图像存储在应用程序/资产/图像中

样式表目录:应用程序/资产/样式表

我知道文件路径必须相对于样式表页面,我已经正确完成了,不是吗?我也尝试将图像移动到样式表目录并更改为url("banner.jpg"),但它仍然不起作用。

编辑:

将网址更改为上传到Google存储桶的图像的链接也不起作用。

background-image: url("https://storage.googleapis.com/#####");

下面的更改应该可以解决问题:

  • 以 css 格式的 BG 网址background-image: url("/assets/benchmark.PNG");
  • 上述 CSS 映射在 ERB 文件中<link rel="stylesheet" href="/assets/test.css">
  • 要查看图像,div 应该有一些数据,因为这是一个div 背景:

<div class="hero-image"> sdfdsfbfd <br/>sdfdsfbfd <br/>sdfdsfbfd <br/>sdfdsfbfd <br/> </div>

最新更新