我是新手,不知所措,如果能在这里指导,我将不胜感激。
我正在开发一个测试站点,就像一个个人博客,只是为一个用户添加投资组合。
我有一个脚手架“仪表板”,用于更新网站的首页信息,例如标题,横幅,关于我等。
来自数据库的所有文本都很好地出现在主页上。
但是,根据主题样式,横幅图像显示不正确。
我的问题-添加横幅时,横幅上方的文本被隐藏了。
下面是我的代码供您参考,我敢肯定我在这一行中犯了一些错误
<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 %>
答案 0 :(得分:2)
使用image_tag
帮助程序将生成并返回完整的a
HTML标签,例如<a src="foo/bar.jpg" />
,而不仅仅是示例中所需的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 %>');">