質問編集履歴
1
追記
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -31,4 +31,35 @@
|
|
|
31
31
|
object-fit: cover;
|
|
32
32
|
}
|
|
33
33
|
```
|
|
34
|
-
ぜひアドバイス宜しくお願い致します。
|
|
34
|
+
ぜひアドバイス宜しくお願い致します。
|
|
35
|
+
###追記2
|
|
36
|
+
以下のように、background-imageとして表示すると、無事トリミングされ、表示することができました。
|
|
37
|
+
```html
|
|
38
|
+
<div class="post-left image1"></div>
|
|
39
|
+
<div class="post-left"><img src="/3.jpg"></div>
|
|
40
|
+
<div class="post-left"><img src="/4.jpg"></div>
|
|
41
|
+
```
|
|
42
|
+
```css
|
|
43
|
+
#追加
|
|
44
|
+
.image1 {
|
|
45
|
+
width: 170px;
|
|
46
|
+
height: 110px;
|
|
47
|
+
border-radius: 5%;
|
|
48
|
+
background-image:url(/2.jpg);
|
|
49
|
+
background-size:cover;
|
|
50
|
+
}
|
|
51
|
+
```
|
|
52
|
+
しかし、以下のようにRubyのeachメソッドで繰り返した場合、background-imageからurlの取得は厳しかったです。
|
|
53
|
+
```ruby
|
|
54
|
+
<% @posts.each do |post| %>
|
|
55
|
+
<div class="post-left">
|
|
56
|
+
<%= image_tag post.image_name.url %>
|
|
57
|
+
</div>
|
|
58
|
+
<% end %>
|
|
59
|
+
```
|
|
60
|
+
```Controller
|
|
61
|
+
def index
|
|
62
|
+
@posts = Post.all
|
|
63
|
+
end
|
|
64
|
+
```
|
|
65
|
+
上記のような状況で、画像のトリミングがうまく行かない場合の方法についてアドバイスを頂ければ幸いです。
|