为 Rails 5 模板中的内嵌背景图片 url 添加一个 image_tag [英] Adding an image_tag for the inline background-image url in Rails 5 template

问题描述

我需要使用样式标签内联设置背景图像，但它需要引用图像对象而不是资产文件夹中的固定图像.以下是我的代码，用于显示我正在尝试执行的操作.

<div class="background-image-holder" style="background: url(#{" image_path @product.photo_one_url(:original)"}); opacity: 1;"><%= image_tag(@product.photo_one_url(:medium)) %>

解决方案

我总是喜欢使用 content_tag 如果我要包含这样的动态内容，即

<%= content_tag :div, class: "background-image-holder",样式:{ 背景:"url('#{image_path(@product.photo_one_url(:original))}')",不透明度:1 } 做 %>...<%结束>

我觉得它比使用内联 erb 标签读起来更好 - 个人喜好，但您的另一个选择.

I need to set the background image inline using the style tag, but it needs to reference an image object and not a fixed image from the assets folder. Below is my code to show what I am attempting to do.

<div class="background-image-holder" style="background: url(#{" image_path @product.photo_one_url(:original)"}); opacity: 1;">
  <%= image_tag(@product.photo_one_url(:medium)) %>
</div>

解决方案

I always prefer to use a content_tag if I'm including something dynamic like this, i.e.

<%= content_tag :div, class: "background-image-holder", 
                      style: { background: "url('#{image_path(@product.photo_one_url(:original))}')", 
                               opacity: 1 } do %>
...
<% end >

I feel it reads nicer than using inline erb tags - personal preference, but another option for you.

这篇关于为 Rails 5 模板中的内嵌背景图片 url 添加一个 image_tag的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！