【问题标题】:Cloud9 IDE + Rails App: CSS Background Image Not Showing on .erb pageCloud9 IDE + Rails 应用程序:CSS 背景图像未显示在 .erb 页面上
【发布时间】:2018-06-23 03:43:36
【问题描述】:

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

我试图在 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>

图像存储在 app/assets/images 中

样式表目录:app/assets/stylesheets

我知道文件路径必须是相对于样式表页面的,我做对了不是吗?我也试过把图片移到样式表目录,改成url("banner.jpg"),还是不行。

编辑:

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

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

【问题讨论】:

  • 你试过background-image: url(asset_path("images/banner.jpg"));

标签: html css ruby-on-rails ruby cloud9-ide


【解决方案1】:

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

  • 在 css 中的 BG url 到 background-image: url("/assets/benchmark.PNG");
  • 上面的css映射到erb文件&lt;link rel="stylesheet" href="/assets/test.css"&gt;
  • 要查看图像,div 应该有一些数据,因为这是 div 背景:

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

【讨论】:

    猜你喜欢
    • 2021-03-30
    • 1970-01-01
    • 1970-01-01
    • 2015-07-10
    • 2017-05-27
    • 1970-01-01
    • 1970-01-01
    • 2023-04-10
    相关资源
    最近更新 更多