【问题标题】:Rails - Unable to add image within style="background-image:url (' ') from databaseRails - 无法在数据库中的 style="background-image:url (' ') 中添加图像
【发布时间】:2019-01-03 08:59:34
【问题描述】:

我是 rails 和 stack over flow 的新手,如果我能在这里指导,我将不胜感激。

我正在开发一个类似于个人博客的测试站点,只是为一个用户添加投资组合。

我有一个脚手架“仪表板”,用于更新网站的主页信息,例如标题、横幅、关于我等。

来自数据库的所有文本都很好地出现在主页上。

但是,横幅图像未按照主题样式正确显示。

我的问题 - 添加横幅后,横幅上方的文本会被隐藏。

以下是我的代码供您参考,我确定我在这一行中犯了一些错误

<div class="swiper-slide cover-background" style="background-image:url('<%= image_tag dashboard.banner1.url %>');">

但是,目前还无法纠正。

原始代码行:

<div class="swiper-slide cover-background" style="background-image:url('http://placehold.it/1920x1080');">

任何帮助或建议都会很棒。

完整代码供参考

<% @dashboards.order('created_at ASC').limit(1).each do |dashboard| %>
<section class="no-padding main-slider height-100 mobile-height wow fadeIn">
    <div class="swiper-full-screen swiper-container height-100 width-100 white-move">
        <div class="swiper-wrapper">
            <!-- start slider item -->
            <div class="swiper-slide cover-background" style="background-image:url('<%= image_tag dashboard.banner1.url %>');">
                <div class="opacity-extra-medium bg-black"></div>
                <div class="container position-relative full-screen">
                    <div class="slider-typography text-center">
                        <div class="slider-text-middle-main">
                            <div class="slider-text-middle">
                                <div class="alt-font text-white text-uppercase font-weight-700 letter-spacing-minus-3 title-extra-large margin-two-bottom width-60 center-col md-width-80 sm-margin-four-bottom xs-width-90 xs-margin-25px-bottom xs-letter-spacing-0"><%= dashboard.name %></div>
                                <div class="btn-dual">
                                    <a href="about-us-modern.html" class="btn btn-transparent-white btn-small xs-margin-two-all">About Company</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- end slider item -->
<% end %>

【问题讨论】:

    标签: html css ruby-on-rails


    【解决方案1】:

    使用image_tag 帮助器将生成并返回一个完整的a HTML 标记,例如&lt;a src="foo/bar.jpg" /&gt;,而不仅仅是您在示例中需要的URL。

    只要改变这一行

    <div class="swiper-slide cover-background" style="background-image:url('<%= image_tag dashboard.banner1.url %>');">
    

    <div class="swiper-slide cover-background" style="background-image:url('<%= dashboard.banner1.url %>');">
    

    【讨论】:

    • @PeeyushVerma 如果有效,请不要忘记接受答案,谢谢!
    猜你喜欢
    • 1970-01-01
    • 2019-04-30
    • 1970-01-01
    • 1970-01-01
    • 2021-12-19
    • 1970-01-01
    • 1970-01-01
    • 2012-12-05
    • 2012-11-26
    相关资源
    最近更新 更多