这是该页面的图像:https://imgur.com/a/EN5TfTu
关于如何仅使图像带有阴影而不是整个宽度的任何建议?
我尝试了几种不同的方法,但是都没有用……我显然做错了什么。
这是HTML:
a = []
for i in y:
print(i)
a.append(i)
CSS:
<div class="jumbotron jumbotron-2">
<div class="image-circle-3">
<div class="center-4">
<%= image_tag @listing.image_url(:thumb) %>
</div>
</div>
</div>
该图像本来应该是一个圆圈,但我只是为了测试它并保持简单而取出了CSS半径。如果您想知道div的名称:)
答案 0 :(得分:1)
将阴影设置为图像,而不是类 .image-circle-3 ,如下所示:
.center-4 img{
box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
}
答案 1 :(得分:0)
只需将box-shadow
样式添加到img
标记中,如下所示
CSS代码-
.image-circle-3 img {
box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
}
另外,请访问此JSFiddle进行现场直播