Railsのimage_tagヘルパーを使い、backgroundで画像を表示する方法

Question

###何をしたいか
現在Railsで画像を表示しています。
RailsTutorial通りにcarrierwaveを使用しています。

Tutorialではimage_tagを使用していますが、cssのbackground-imageを使い要素いっぱいに表示したいです。

しかしながら、if文で条件分岐をしているので、画像の狙い撃ちができない状態です。

###コード
画像がある場合と、ない場合があります。

# 一覧のパーシャル
<div class="thumb">
  <% if shop.shop_image? %>
  <%= image_tag(shop.shop_image.url(:thumb)) %>
  <% else %>
  <%= image_tag "default-shop-image.png" %>
  <% end %>
</div>

thumbの部分は固定の高さがあります。thumbの部分いっぱいに画像を表示するイメージです。

###cssでどう書くの？
普通だったら以下のように書くと思います。

# css
.thumb{
  background: url(ここにpath);
  background-size: cover;
  background-position: center     center;
  background-repeat: no-repeat;
}

ただ条件分岐があるので、画像がある場合とない場合でも同じレイアウトで表示したいです。

この場合どのようなコードで実装すればよいのでしょうか？

Answer 1

どこのHTMLタグに css を当てたいのかちゃんと理解できていませんが、 仮に "div.thumbnail" にbackground-image を指定したいのであれば、 下記のように style属性にcssを書くのが一番簡単かと思います。

<div class="thumb" style="<%= shop.shop_image? ? shop.shop_image.url(:thumb) : 'default-shop-image.png' %>">
</div>