下面是html代码:
<div class="whyimgbx">
<span class="partnerHospitals">
</span>
</div>
代替上面的内容,如果我直接将图片网址指定为跨度,则效果很好:
<span><img src="assets/images/1.png" alt=""></span>
但是当跨度提供类名时,它不起作用
下面是CSS:
.partnerHospitals {
background-image: url(assets/images/1.png)!important;
}
我在span标签中没有得到partnerHospitals
张图片。拜托,有人可以建议为什么这不起作用吗?
答案 0 :(得分:4)
因为跨度没有内容,所以没有大小。您需要为元素添加尺寸:
.partnerHospitals {
background-image: url(assets/images/1.png);
display: block; // or inline-block to preserve spans behaviour
width: 150px;
height: 150px;
}
答案 1 :(得分:0)
尝试
.partnerHospitals {
background-image: url(assets/images/1.png);
width: yourWidth;
height: yourHeight;
display:block
}
答案 2 :(得分:0)
很多原因都可能导致这种情况。
partnerHospitals
未设置宽度/高度。因此它不占用任何空间。对于1.检查下面的答案
.partnerHospitals {
width: 100px;
height: 100px;
background-image: url("https://via.placeholder.com/50x50");
display: inline-block;
}
<div class="whyimgbx">
<span class="partnerHospitals">
</span>
</div>